Как фильтровать массив объектов на основе массива определенного свойства объекта?

Question

Вот небольшой пример моего HTML с использованием ng-repeat:

<div ng-repeat="item in vm.templateList | filter: vm.myFilter"> 
    <h3>{{item.Code}}</h3> 
</div> 

В Js файл vm.templateList нижеследовал (в качестве примера):

vm.templateList = [{Code: 'a', ID: 1}, 
        {code: 'a', ID: 2}, 
        {code: 'b', ID: 3}, 
        {code: 'c', ID: 4}]; 

Представьте себе, я хочу, чтобы отфильтровать этот список для всех предметы, имеющие ID 1, а также элементы, которые имеют ID 2.

То, что я изначально делал, было так:

vm.filter = {ID: 1}; 

Но это был я могу только отфильтровать список по 1 ID. Может ли кто-нибудь предложить способ?

Answer 1

Вы можете добавить следующий AngularJS фильтр приложения:

// add a custom filter to your module 
angular.module('MyModule').filter('myFilter', function() { 
    // the filter takes an additional input filterIDs 
    return function(inputArray, filterIDs) { 
     // filter your original array to return only the objects that 
     // have their ID in the filterIDs array 
     return inputArray.filter(function (entry) { 
      return this.indexOf(entry.ID) !== -1; 
     }, filterIDs); // filterIDs here is what "this" is referencing in the line above 
    }; 
}); 

Вы затем объявить массив фильтров в контроллере, как например:

vm.IDs = [1, 2]; 

Тогда ваш взгляд должен выглядеть следующим образом:

<div ng-repeat="item in vm.templateList | myFilter: vm.IDs"> 
    <h3>{{item.Code}}</h3> 
</div> 

Answer 2

Вы можете использовать что-то наподобие:

HTML:

<section> 
    <div ng-repeat="item in vm.templateList | filter:checkFilterOptions"> 
     <h3>{{item.Code}}</h3> 
    </div> 
</section> 

Js:

$scope.vm = {}; 
    $scope.vm.templateList = [ 
        {Code: 'a', ID: 1}, 
        {Code: 'a', ID: 2}, 
        {Code: 'b', ID: 3}, 
        {Code: 'c', ID: 4} 
        ]; 

    $scope.filterOptions = [1,2,3]; 

    $scope.checkFilterOptions = function(value, index) { 
     return value.ID && $scope.filterOptions.indexOf(value.ID) !== -1; 
    }