ondragstart、ondragover、onstart - $scope 未定义

Question

我的任务是使用 angular 处理删除的文本。我在拖放事件中不断收到此错误 $scope is not defined。知道如何解决这个问题吗？

我已经研究过 angular 拖放库。他们不允许拖放简单的文本。他们中的大多数都使用列表。让我知道是否有适合这项任务的

这里是 plunker：

[http://plnkr.co/edit/egKL13hsHka6RiX4UfSS?p=preview][1]

这里是控制器：

var app = angular.module("test",  []);
app.controller('testCtrl', ['$scope',function  ($scope) {
   $scope.nouns = ['guitar'];
   $scope.verbs = ['play'];
   $scope.allowDrop= function (ev) {
        ev.preventDefault();
   };
   $scope.drag=  function (ev) {
        ev.dataTransfer.setData("Text", ev.target.id);
   };    
   $scope.drop=  function (ev) {
        ev.preventDefault();
        var data = ev.dataTransfer.getData("Text");
        if(ev.target.id =='verb' && $scope.verbs.indexOf(data) != -1){
            ev.target.appendChild(document.getElementById(data));
        }
        else{
            alert(data + ' is not a ' + ev.target.id +'. Try again');
        }            
    };      
  }]);

Answer 1

$scope 对象在 "Outside angular context" 中不可用。每当您想访问 JavaScript 中的 angular 范围（在 angular 世界之外）时，您需要通过获取该元素的 DOM 来获取 scope ＆然后像 angular.element(document.getElementById('testApp')) 一样访问它的范围，它只是主体的范围。

Working Plunkr

参考此 SO answers 以访问 angular 上下文之外的范围。

Answer 2

基于@pankaj-parkar 回答的较短的一个：

<div draggable="true" ondrag="angular.element(this).scope().on_drag(event)"></div>

ondragstart、ondragover、onstart - $scope 未定义

ondragstart, ondragover,onstart - $scope is not defined

javascript

drag-and-drop

angularjs

angularjs-digest