3
angular.module('myApp').directive('dragDrop', function() {
return {
link:function(scope,element){
element.on('dragover', function(event) {
event.preventDefault();
});
element.on('drop', function(event) {
event.preventDefault();
var data=event.originalEvent.dataTransfer.getData("Text");
event.target.parentNode.appendChild(document.getElementById(data));
});
element.on('drag', function(event) {
event.originalEvent.dataTransfer.setData("Text",event.target.id);
console.log(event.originalEvent.dataTransfer.getData("Text"));
scope.$apply();
});
}
};
});
Приведенный выше код очень хорошо работает, когда я настраиваю его, не используя AngularJS. Когда я создаю вышеуказанную директиву по какой-то совершенно необъяснимой причине console.log(event.originalEvent.dataTransfer.getData("Text"));ничего не выводит. Почему это? Я также представить HTML-код (функциональность перетаскивания между двумя списками):Событие перетаскивания в Угловом
<div class="col-xs-6" drag-drop>
<div class="header">Available Life Events</div>
<ul class="permission-levels">
<li style="margin:20px;" ng-attr-id="{{'ALE'+$index}}" draggable="true"
ng-repeat="event in Events track by $index">
{{event.name}}
</li>
</ul>
</div>
<div class="col-xs-6" drag-drop>
<div class="header">Life Events Applied</div>
<ul class="permission-levels">
<li style="margin:20px;" ng-attr-id="{{'LEA'+$index}}" draggable="true"
ng-repeat="event in events track by $index">
{{event.name}}
</li>
</ul>
</div>
Тем временем я где-то читал, что данные доступны только при падении. Тем не менее, даже внутри события падения недоступно ... –