Html5拖放-复制文本到放置位置答案

【问题标题】：Html5 drag and drop - copy text to drop positionHtml5拖放-复制文本到放置位置
【发布时间】：2016-01-12 08:09:24
【问题描述】：

在我的 AngularJS 应用程序中，我有一个带有一些文本和可用关键字列表的文本区域。

当用户将特定单词拖放到文本区域内时，该单词应插入放置位置。

为了简单的演示 - 尝试在浏览器中选择一些文本并将其拖动到页面中的任何输入字段 - 文本正好插入到放置位置。

我想实现相同的功能。我该怎么办？

为了使用 HTML5 DND 和 angular，我使用了这个 fiddle 中的指令 - http://jsfiddle.net/jgoemat/NWnF8/

module.directive('draggable', function () {
  return {
    restrict: 'A',
    link: function (scope, element, attrs) {
    element[0].addEventListener('dragstart', scope.handleDragStart, false);
    element[0].addEventListener('dragend', scope.handleDragEnd, false);
   }
  }
});

module.directive('droppable', function () {
  return {
    restrict: 'A',
    link: function (scope, element, attrs) {
      element[0].addEventListener('drop', scope.handleDrop, false);
      element[0].addEventListener('dragover', scope.handleDragOver, false);
    }
  }
});

【问题讨论】：

标签： angularjs html drag-and-drop

【解决方案1】：

$scope.$digest();

http://jsfiddle.net/NWnF8/11/

阅读有关$digest 的更多信息。 https://docs.angularjs.org/api/ng/type/$rootScope.Scope

【讨论】：