ng-repeat 中的 $index 删除后未更新

Question

情况

在图像上你可以看到我想要做什么。单击时，使用ng-repeat动态添加一行输入字段。+step删除x一个步骤并将up and down arrows步骤向上或向下移动一位。
我希望当台阶不能走高时禁用向上箭头，当台阶不能走低时禁用向下箭头。到目前为止，当我只添加步骤（而不是删除）时，它工作得很好。然而，当我删除一个步骤时，尽管在打印时它似乎$index已更新，但不知何故并未更新。ng-disabled

问题

这是删除第一步后得到的结果： image
如您所见，向下数组被禁用。虽然打印的索引是0，但是里面的索引ng-disabled一定还是1。

HTML：

<div class="col-sm-2 nopadding">
    <div class="btn-group btn-lg" role="group">
        <!--move step up-->
        <button type="button" class="btn iconbutton  " ng-click="" ng-disabled="{{$index}}==0"><span class="glyphicon glyphicon-arrow-up" aria-hidden="true"></span> 
        </button>
        <!--move step down-->
        <button type="button" class="btn iconbutton " ng-click="" ng-disabled="{{$index}}==normal.length-1"><span class="glyphicon glyphicon-arrow-down" aria-hidden="true"></span> 
        </button>
        <!--remove step-->
        <button type="button" class="btn iconbutton " ng-click="removeStep(step,'normal',0)"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span> 
        </button>
    </div>
    <p>index={{$index}}, length= {{normal.length}}</p>
</div>

删除控制器中的功能：

$scope.removeStep = function (item,flow,index) {
   if(angular.equals(flow,'normal')){
        var i = $scope.normal.indexOf(item);
        $scope.normal.splice(i, 1); 

   }
   if(angular.equals(flow,'alternative')){
        var i = $scope.alternative[index].behavior.indexOf(item);
        $scope.alternative[index].behavior.splice(i, 1); 


   }
   if(angular.equals(flow,'exceptional')){
        var i = $scope.exceptional[index].behavior.indexOf(item);
        $scope.exceptional[index].behavior.splice(i, 1); 
   }

};

更新：找到了解决方法

它不像使用 $index 那样干净，但我在控制器中编写了一个函数，给定项目，该函数返回该项目在数组中的位置。这适用于所有情况

Answer 1

按 $index 进行用户跟踪

ng-repeat="i in items track by $index"

当你从数组中删除一个元素时，数组元素将被重新索引，并且 Angular 将删除关联的 dom 元素。但它不会使用新的索引数组重新渲染视图。这就是为什么从数组中删除元素后 $index 的值不会改变。如果你使用 track by $index 那么 Angular 也会跟踪 $index 并相应地更新它的值。