交换角度js中的元素

Ken*_*nny 1 javascript jquery angularjs

假设我有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);
}
Run Code Online (Sandbox Code Playgroud)

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>
Run Code Online (Sandbox Code Playgroud)

如您所见,在交换一次后,我无法再次交换它们.我认为绑定必须丢失.

任何帮助表示赞赏

dev*_*080 5

像这样定义移动:

$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();
 }; 
Run Code Online (Sandbox Code Playgroud)

而不是传入$ 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>
Run Code Online (Sandbox Code Playgroud)