функция перетаскивания в AngularJs

Question

Я пытаюсь использовать функцию перетаскивания в своем приложении, я загрузил модуль перетаскивания, который можно найти здесь: https://github.com/a5hik/ng-sortable. Мне нужно использовать простой пример именно так: http://a5hik.github.io/ng-sortable/#/kanban Я не знаю, как его использовать, если мне нужно загрузить другую вещь. Заранее спасибо за вашу помощь

Answer 1

Update: Вот простой рабочий пример: Plunker

Просто следуйте инструкциям, которые это link mentioend.

Шаг 1: Обязательно загрузите скрипты в свой html

<script type="text/javascript" src="dist/ng-sortable.min.js"></script> 
<link rel="stylesheet" type="text/css" href="dist/ng-sortable.min.css"> 

<!-- OPTIONAL: default style --> 
<link rel="stylesheet" type="text/css" href="dist/ng-sortable.style.min.css"> 

Шаг 2: И Инжектируйте Сортируемый модуль как зависимость

angular.module('xyzApp', ['as.sortable', '....']); 

Шаг 3: вызвать директивы, используя ниже HTML структуры

Html

<ul data-as-sortable="board.dragControlListeners" data-ng-model="items"> 
    <li data-ng-repeat="item in items" data-as-sortable-item> 
     <div data-as-sortable-item-handle></div> 
    </li> 
</ul> 

Шага 4: Определить обратные вызовы в контроллере вызывающего

JS

$scope.dragControlListeners = { 
    accept: function (sourceItemHandleScope, destSortableScope) {return boolean}//override to determine drag is allowed or not. default is true. 
    itemMoved: function (event) {//Do what you want}, 
    orderChanged: function(event) {//Do what you want}, 
    containment: '#board'//optional param. 
    clone: true //optional param for clone feature. 
    allowDuplicates: false //optional param allows duplicates to be dropped. 
}; 

$scope.dragControlListeners1 = { 
     containment: '#board'//optional param. 
     allowDuplicates: true //optional param allows duplicates to be dropped. 
}; 

И вы можете проверить точный пример вы уже упоминали выше, используя F12 Key.

Answer 2

Это может быть полезно попробовать использовать этот модуль

http://angular-dragdrop.github.io/angular-dragdrop/