web-dev-qa-db-ja.com

AngularJSのフィルターで配列からアイテムを削除する方法は？

フィルターなしでtrをクリックすると、関数array.splice()が機能します。配列内のインデックスは正しい順序になっているため、array.splice()は機能します。

フィルターが有効な場合、配列内のインデックスは更新されず、同じ順序のままです。したがって、array.splice()は間違ったアイテムを削除します。

    <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);
    };

配列のインデックスを更新するには？または正しいアイテムを削除する方法は？

javascriptarraysangularjsfilterangularjs-ng-repeat
12
Steffi

最も簡単な解決策は、インデックスの代わりにプロジェクトを取り込むように削除関数を変更することです。

$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);
        }
    }
}

プランカーの例： http://plnkr.co/edit/51SNVMQjG3dsmpYI5RyY?p=preview

8
Shawn C.

IndexOfを使用して、配列内の要素の実際の位置にプロジェクトをスプライスする方が簡単です。

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

この方法では、現在のプロジェクトのみを削除機能に渡す必要があります。

<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>
21
Victor Ivens