拖放列表，angularjs [英] Drag and Drop list, angularjs

问题描述

我需要一个有角度的拖放列表，但是我需要更改 $ scope.list ，因为我必须将新的订单存储在我的数据库中。 p>

我发现这个答案，我用它来获得这个 http://jsfiddle.net / aras7 / 9sueU / 1 /

  var myapp = angular.module（'myapp'，['ui' ]）; 
 
 myapp.controller（'controller'，function（$ scope）{
 $ scope.list = [one，two，three，four，five ，六]; 
}）; 
 
 angular.bootstrap（document，['myapp']）; 
  

问题是当我尝试从上到下更改元素时，一个属性不起作用

例如拿一个，把它放一个位置，得到两个，一个，三个，四个，...第二个列表也应该改变，但是没有。

  two 
 one 
 three 
 five 
四
六
 ---------- 
一
二
三
五
四
 6 
  

两个列表都应该是等于。

解决方案

可以让您无需任何错误，您需要添加 sortable.js ，并使用这样的ui.sortable启动该模块

  var myapp = angular.module（'myapp'，['ui.sortable']）; //添加.sortable 
 
 myapp.controller（'controller'，function（$ scope）{
 $ scope.list = [一，二，三，四 五，六]; 
}）; 
 
 angular.bootstrap（document，['myapp']）; 
  

http://jsfiddle.net/9sueU/3/

I need a drag and drop list with angular, but I need the $scope.list change too because I must store the new order in my data base.

I found this answer and I used it to get this http://jsfiddle.net/aras7/9sueU/1/

var myapp = angular.module('myapp', ['ui']);

myapp.controller('controller', function ($scope) {
    $scope.list = ["one", "two", "three", "four", "five", "six"];
});

angular.bootstrap(document, ['myapp']);

The problems is that when I try to change a element from top to down ONE possition is does NOT work.

For example take "one" and take it one position down to get "two,"one","three","four", ... second list should also change but it doesn't.

two
one
three
five
four
six
----------
one
two
three
five
four
six

both list should be equals.

解决方案

to get the ui-sortable to work without bugs you need to add the sortable.js and start the module with ui.sortable like this

var myapp = angular.module('myapp', ['ui.sortable']);//add .sortable

myapp.controller('controller', function ($scope) {
    $scope.list = ["one", "two", "three", "four", "five", "six"];
});

angular.bootstrap(document, ['myapp']);    

http://jsfiddle.net/9sueU/3/

这篇关于拖放列表，angularjs的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！