CODEWITHSUNDEEP
javascriptarraysangularjsfilterangularjs-ng-repeat
Steffi
Steffi

Reputation: 7057

How to remove item from array with filter in AngularJS?

When I click on tr without any filter, my function array.splice() works. Indexes in the array are in the correct order, so the array.splice() works.

When the filter is enable, Indexes in the array are not updated and still in the same order. So array.splice() removes the wrong item. 

    <span ng-click="orderP0 = 'statut_name'; reversePO=!reversePO">order</span>

    <tr ng-repeat="project in projects | orderBy : orderPO : reverse track by $index" ng-click="remove($event,$index,projects)">
        <span class="label" ng-bind="project.statut_name"></span>
    </tr>

    $scope.remove = function($event,index,array){
        array.splice(index,1);
    };

How to update index in the array ? Or How to removes the right item ?

Upvotes: 12

Views: 49382

Answers (2)

Victor Ivens
Victor Ivens

Reputation: 2279

It's easier to splice you projects in the actual position of the element in the array using indexOf.

$scope.remove = function(project){
    $scope.projects.splice($scope.projects.indexOf(project),1);
}

This way you need to pass to the remove function only the current project.

<tr ng-repeat="project in projects | orderBy : orderPO : reverse track by $index" ng-click="remove(project)">
    <span class="label" ng-bind="project.statut_name"></span>
</tr>

Upvotes: 22

Shawn C.
Shawn C.

Reputation: 6841

The simplest solution would be to change your remove function to take in the project instead of the index. 

$scope.remove = function(project){
    for(var i = $scope.projects.length - 1; i >= 0; i--){
        if($scope.projects[i].statut_name == project.statut_name){
            $scope.projects.splice(i,1);
        }
    }
}

Example Plunker: http://plnkr.co/edit/51SNVMQjG3dsmpYI5RyY?p=preview

Upvotes: 8

Related Questions