2016-06-10 3 views
0

Я создал an ng-sortable example in Plunker, но он не работает.ng-sortable не работает в plunker

Вот JavaScript:

angular.module('sortableExample', []) 
.controller('PresidentsCtrl', ['$scope', function($scope) { 
    $scope.presidents = [ 
    'George Washington', 
    'Abraham Lincoln', 
    'William Jefferson Clinton' 
    ]; 

    $scope.dragControlListeners = { 
    accept: function(sourceItemHandleScope, destSortableScope) { return true }, 
    itemMoved: function(event) {}, 
    orderChanged: function(event) {} 
    }; 
}]); 

И HTML:

<!DOCTYPE html> 
<html ng-app="sortableExample"> 

    <head> 
    <script data-require="[email protected]" data-semver="1.5.6" src="https://code.angularjs.org/1.5.6/angular.min.js"></script> 
    <link rel="stylesheet" href="style.css" /> 

    <script src="https://raw.githubusercontent.com/a5hik/ng-sortable/master/dist/ng-sortable.js"></scr</script> 
    <link rel="stylesheet" href="https://raw.githubusercontent.com/a5hik/ng-sortable/master/dist/ng-sortable.css"> 

    <script src="script.js"></script> 
    </head> 

    <body ng-controller="PresidentsCtrl"> 
    <ul data-as-sortable="dragControlListeners" data-ng-model="presidents"> 
     <li data-ng-repeat="president in presidents" data-as-sortable-item> 
     <div data-as-sortable-item-handle>{{ president }}</div> 
     </li> 
    </ul> 
    </body> 

</html> 

Право материал показывает вверх, но это не является интерактивным, как это должно быть. Любая идея почему?

+0

Я не знаю о коде на вашей машине, но вы на самом деле не добавили нг-сортировкой JS в plunker – George

ответ

1

Вы не должны включать ссылки на источник github -) Поскольку нет cdn для ng-sortable - просто скопируйте его в plunker.

Также вы забыли добавить зависимость ng-приложения.

angular.module('sortableExample', ['as.sortable']) 

http://plnkr.co/edit/gRRzaVfwIycdzfApmebB?p=preview

Смежные вопросы