不能得到AngularUI可排序的演示工作

Question

有麻烦了角的UI简单排序演示去这里 - http://jsfiddle.net/B3YDr/：

<div ng-app="myApp" ng-controller="myCtrl"> 
<ul ng-model="items" ui-sortable> 
    <li ng-repeat="item in items">{{item}}</li> 
</ul> 
<pre>{{items}}</pre> 
</div> 


angular.module('myApp', ['ui']); 
var myCtrl = function($scope) { 
    $scope.items = ['One','Two','Three']; 
}; 

• 包括jQuery的& jQueryUI的
• 包括AngularJS
• 包括AngularUI
• 添加'ui'模块作为依赖项

我已经复制了示例代码几乎就像这里http://angular-ui.github.io/#directives-sortable这样但仍然不能重新排列列表项目。

任何人都可以指出什么是错的？由于

Answer 1

你需要控制脚本的输入顺序：前角的角度使用它作为元素的服务

http://jsfiddle.net/B3YDr/4/

看跌的jQuery。

<div ng-app="myApp" ng-controller="myCtrl"> 
    <ul ng-model="items" ui-sortable> 
     <li ng-repeat="item in items">{{item}}</li> 
    </ul> 
    <pre>{{items}}</pre> 
</div> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.1.3/angular.min.js"></script> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.min.js"></script> 
<script src="http://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.2.0/ui-bootstrap-tpls.js"></script> 

Answer 2

您可以使用sortableOptions方法，如下面的代码

$scope.sortableOptions = { 
      handle: '.custom-ctrl-handle', 
      stop: function(e, ui) { 
       // console.log("stop function worked"); 
      } 
     };