如何使用AngularJS自定義過濾器和lodash

Question

在lodash中使用Angular v1.5.8。我在ng-repeat中設置了一個數組的自定義過濾器。當它被選中時，我也有一個複選框，過濾器將從ng-repeat中刪除某個元素，當未選中時，該元素將被重新添加到ng-repeat中。

除了複選框條件，該過濾器包含應用角度的filter過濾器以始終刪除某些元素。

角應用程式：

angular.module('app', []) 

.controller('appCtrl', ['$scope', 
    function($scope) { 
    $scope.newArray = [1,2,3,4,5]; 
    }]) 

.filter('simpleFilter', function($filter){ 
    return function(newArray,checked){ 
    newArray = $filter('filter')(newArray, '!4'); 

    if(checked){ 
     _.remove(newArray, function(elem){ 
     return elem == 2; 
    }); 
    } 
    return newArray; 
    } 
}); 

和HTML：

<div ng-app="app"> 
<div ng-controller="appCtrl"> 

    <span ng-repeat="el in newArray | simpleFilter:obj.checked"> 
    {{el}} 
    </span> 
<hr> 
    <input type="checkbox" ng-model="obj.checked"> 

    </div> 
</div> 

以上順利工作的例子，但如果我從自定義過濾器移除默認過濾器（這行：newArray = $filter('filter')(newArray, '!4');）和複選框會被重新檢查，被_.remove隱藏的元素不會再出現。

這裏是問題：https://codepen.io/neptune01/pen/rzbLmp

Answer 1

你必須使用_filter lodash方法，而不是_remove。

不同於_.filter,_remove方法變異原始數組。

angular.module('app', []) 
.controller('appCtrl', ['$scope', 
    function($scope) { 
    $scope.newArray = [1,2,3,4,5]; 
    }]) 
.filter('simpleFilter', function($filter){ 
    return function(newArray,checked){ 
    //newArray = $filter('filter')(newArray, '!4'); 
    if(checked){ 
     newArray=_.filter(newArray, function(elem){ 
     return elem != 2; 
    }); 
    } 
    return newArray; 
    } 
}); 

這裏是working solution.

您還可以使用$filter方法，以獲得更萊蒂解決方案。

if(checked) 
    newArray = $filter('filter')(newArray, '!2'); 
return newArray;