Löschen von Elementen dynamisch aus der ng-repeat generierten Liste

Question

Ich habe ein Array von JSON-Objekten, die verschachtelte Arrays haben. Ich verwende ng-repeat, um eine Liste mit diesen verschachtelten Arrays zu erstellen. Ich möchte die Elemente aus der Liste dynamisch beim Klicken auf die Schaltfläche löschen. Ich habe eine Funktion in der Steuerung geschrieben, dass-

$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]; 

} 

zu tun und nannte es Ähnliche Videos-

<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> 

Problem ist, dass ich nicht mehr als ein Element löschen können, wie nach dem ersten Element Indizes ändert sich in Array, aber ng-repeat ändert den Index in seinem Umfang nicht. Wie kann ich dieses Problem lösen? Kann ich ng-repeat machen, re plot selbst, nachdem ich irgendeine Änderung vorgenommen habe
Ich lerne nur eckige js, also bitte führe mich, wenn es einen besseren Weg gibt, solche Dinge zu tun.

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> 

Hier result.features ist ein Array. Senden Sie also $ index von AngularJS template, die dem Array-Index entsprechen, den Sie löschen möchten.
zB ng-click = "entfernen ($ index)" dann in der Steuerung

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

Answer 2

versuchen Sie dies:

<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> 

und in Funktion remove

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>