从 ng-repeat 生成的列表中动态删除元素

Question

我有一个包含嵌套数组的 json 对象数组。我正在使用 ng-repeat 来创建包含这些嵌套数组的列表。我想在按钮单击时从列表中动态删除项目。我已经在控制器中编写了一个函数来做到这一点-

$scope.remove= function(path){
    var obj = $scope.results[$scope.editIndex];

    var i;
    for(i = 0; i<path.length-1;i++){

        var key = path[i].key;
        var index = path[i].index;
        if(!obj[key]) return;
        obj = obj[key]

    }
    delete obj[path[i].key][path[i].index];

}

并称它为-

<ul ng-show="showFeatures">
   <li ng-repeat="(featureIndex,feature) in result.features">
        <span ng-bind="feature" contenteditable={{result.edit}}></span>
            <i class="flr-always material-icons pointer" ng-show="result.edit" ng-click="remove([{key:'features',index:featureIndex}])">delete</i>
    </li>
</ul>

问题是我不能删除多个元素，因为数组中的第一个元素索引会发生变化，但 ng-repeat 不会更改其范围内的索引。我怎么解决这个问题 ？我可以在进行任何更改后进行 ng-repeat，重新绘制自己吗
我只是在学习 angular js，所以如果有更好的方法来做这些事情，请指导我。

Answer 1

<li ng-repeat="(featureIndex,feature) in result.features">
        <span ng-bind="feature" contenteditable={{result.edit}}></span>
            <i class="flr-always material-icons pointer" ng-show="result.edit" ng-click="remove([{key:'features',index:featureIndex}])">delete</i>
 </li>

这里 result.features 是一个数组。因此，从 AngularJS 模板发送 $index 将对应于您要删除的数组索引。
例如，ng-click="remove($index)" 然后在控制器中

function remove(index){
    $scope.result.features.splice($index, 1)
}

Answer 2

试试这个：

 <li ng-repeat="feature in result.features">
    <span ng-bind="feature" contenteditable={{result.edit}}></span>
        <i class="flr-always material-icons pointer" ng-show="result.edit" ng-click="remove(feature )">delete</i>
 </li> 

在删除功能中

   function remove(feature){
     var index = $scope.result.features.indexOf(feature);
      if(index > -1)
       $scope.result.features.splice(index, 1);
    } 

var app = angular.module("app",  []);

app.controller('mainCtrl', function($scope){
  $scope.result = {
                    features:
                      [
                        "ali","reza","amir"
                     ]
                 };
  
  
    $scope.remove = function(feature){
     var index = $scope.result.features.indexOf(feature);
      if(index > -1)
       $scope.result.features.splice(index, 1);
    } 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css" rel="stylesheet"/>

<div ng-app="app" ng-controller="mainCtrl">
      <li ng-repeat="feature in result.features">
        <span ng-bind="feature"></span>
        <i  ng-click="remove(feature)">delete</i>
     </li> 
</div>