Я пытаюсь реализовать Drag and Drop с использованием реализации jQuery пользовательского интерфейса c0deformer (см. Здесь: http://codef0rmer.github.io/angular-dragdrop/#/). Функция перетаскивания работает нормально, но я не могу получить функциональность, которую я получаю в терминах понижаться. В этом приложении я хочу иметь возможность отбрасывать перетаскиваемые элементы в любом месте целевого div, т. Е. Я не хочу, чтобы область назначения ограничивалась структурой типа списка (или набором повторяющихся div). В основном это потому, что пользователь будет перетаскивать элементы «на лету», и не будет никакого способа узнать, сколько предметов пользователь перетащит заранее.Перетаскивание в AngularJS
Я просмотрел веб-сайт и не могу найти пример в Angular, который использует перетаскивание без эффективного перетаскивания из одного списка в другой список. Это можно сделать? Если это так, я не уверен, как я буду соответствующим образом обновлять область после того, как элемент был перетащен. В этом примере ниже приведенные элементы вставляются в область второго списка и применяется новая область. В идеальном случае объем выпавших предметов является целевым div, о котором я упоминал выше. Я действительно новичок в Angular, поэтому любые советы очень ценятся.
Отрывок из c0deformer:
app.directive('droppable', function($compile) {
return {
restrict: 'A',
link: function(scope,element,attrs){
//This makes an element Droppable
element.droppable({
drop:function(event,ui) {
var dragIndex = angular.element(ui.draggable).data('index'),
dragEl = angular.element(ui.draggable).parent(),
dropEl = angular.element(this);
console.log(dropEl);
if (dragEl.hasClass('list1') && !dropEl.hasClass('list1') && reject !== true) {
scope.list2.push(scope.list1[dragIndex]);
scope.list1.splice(dragIndex, 1);
} else if (dragEl.hasClass('list2') && !dropEl.hasClass('list2') && reject !== true) {
scope.list1.push(scope.list2[dragIndex]);
scope.list2.splice(dragIndex, 1);
}
scope.$apply();
}
});
}
};
});
Вы должны поместить директиву перемещаемой на элементы, которые вы хотите быть перетаскивать и директиву сбрасываемой на элементы, которые вы хотите быть Droppable. Неважно, какой он элемент. Что именно вы хотите сделать? Просто перетащите элемент вокруг? – pasine
@notme - У меня есть несколько перетаскиваемых элементов (они находятся в списке), которые могут быть сброшены в пределах одного целевого div (не один div на li). Я не смог заставить это работать в коде, который я вставил. –
Не могли бы вы добавить еще код? Можете ли вы создать jsfiddle/plunker с нерабочим кодом? – pasine