Question

假设我有n个元素。在DOM中使用ng-repeat进行渲染。

现在我具有上移和下移元素的功能。为此，我使用jQuery根据方向（向上或向下）交换两个元素。哪个工作正常。

但是在交换之后我失去了角度的所有绑定。我希望绑定原样。

的Javascript

$scope.move = function(event, direction) {
    var div1 = $(event.currentTarget).parent(),
        div2 = direction === 'up' ? $(div1).prev() : $(div1).next(),
        tdiv1 = div1.html(),
        tdiv2 = div2.html();

    div1.html(tdiv2);
    div2.html(tdiv1);
}

HTML

<div ng-repeat="item in itemList">
    {{$index}}

    <div ng-click="move($event, 'up')"> Move up </div>
    <div ng-click="move($event, 'down')"> Move Down </div>
</div>

正如您所看到的，在一次交换之后，我无法再次交换它们。我想绑定必须丢失。

感谢任何帮助

Answer 1

像这样定义移动：

$scope.move = function(index, direction) {
 var itemToMove = $scope.itemList[index];

 if(direction==='up'){
      $scope.itemList[index] = $scope.itemList[index - 1];
      $scope.itemList[index - 1] = itemToMove;
 } else{
      $scope.itemList[index] = $scope.itemList[index + 1];
      $scope.itemList[index + 1] = itemToMove;
 }
 if(!$scope.$$phase)
         $scope.$apply();
 };

不是传入$ event来操作DOM，而是传入$ index来操作数组：

<div ng-repeat="item in itemList">
{{$index}}

<div ng-click="move($index, 'up')"> Move up </div>
<div ng-click="move($index, 'down')"> Move Down </div>
</div>

交换角度js中的元素

1 个答案: