2014-10-07 4 views
0

Мне нравится, как работает фильтр AngularJS, и просто хотел бы добавить функцию к существующему, чтобы разрешить использование массивов, чтобы узнать, находится ли значение в массиве.Расширение фильтра AngularJS или создание настраиваемого фильтра

Если у меня есть следующие данные:

Queue = [ 
    {'Name':'John','Tier':'Gold','Status':'VIP'}, 
    {'Name':'Anna','Tier':'Silver','Status':'Normal'}, 
    {'Name':'Luke','Tier':'Gold','Status':'Normal'}, 
    {'Name':'Mary','Tier':'Bronze','Status':'Normal'}, 
    {'Name':'Jess','Tier':'Bronze','Status':'VIP'}, 
]; 
Priority = ['Gold','Silver']; 

Я хочу перечислить имена всех моих членов Priority, которые также являются VIP-персон.

<div ng-repeat="people in Queue | filter: {Tier:Priority} | filter: {Status:'VIP'}">{{ people.Name }}</div> 

Я хотел бы добавить возможность для фильтра, чтобы проверить, если Tier равен одному из элементов массива Priority.

Я посмотрел на создание настраиваемого фильтра с помощью AngularJS, но я не знаю, как заставить этот фильтр клиента работать так же, как и существующий фильтр, то есть иметь возможность обрабатывать объекты, строки или функции, подобные существующим.

Я не так много после кода для проверки того, существует ли элемент в массиве, я после кода для создания фильтра таким же образом, когда я могу добавить код, чтобы определить, указано ли заданное значение строка или массив.

ответ

0

Я буду использовать регулярные выражения в этом случае, чтобы проверить с помощью пользовательского фильтра.

В .html:

<body ng-app="myApp"> 
    <tr ng-repeat="item in Queue | regex:'Tier':Priority | filter:{Status :'VIP'}"> 
    </body> 

и пользовательский фильтр:

var myApp = angular.module('myApp', []); 
myApp.filter('regex', function() { 
    return function(input, field, priList) { 
    var result = []; 
    var priListExp = priList.join("|"); 
    var patt = new RegExp(priListExp, "i"); // without , "i" if you want to use case insensitive 
     input.forEach(function(pri){ 
     if(patt.test(pri[field])) { 
      result.push(pri); 
     } 
    }); 

    return result; 
    } 
}); 

демо: Plunker

0

Это идея, ее не рабочий код. Если передать аргументы в фильтр, и может записать это что-то вроде этого:

module.filter('filterName', function() { 
return function(input, tier, status) { 
if (input.Tier == tier) 
{ 
    //do something 
} 
if (input.Status == status) 
{ 
    //do something 
} 
return input; 
} 
}); 

В HTML -

<div ng-repeat="people in Queue | filterName:'Priority':'VIP'">{{ people.Name }}</div> 
Смежные вопросы