扩展AngularJS过滤器或构建自定义筛选器

Question

我喜欢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'];

我想列出所有优先成员的名字，他们也是贵宾。

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

我想添加过滤器的功能，以检查Tier是否等于优先级数组中的一个项。

我已经研究过用AngularJS构建自定义过滤器，但我不知道如何使该客户过滤器与现有过滤器一样工作，即能够像现有过滤器那样处理对象、字符串或函数。

我不是在检查数组中是否存在项的代码之后，而是在创建过滤器的代码之后，我可以添加代码来检测给定的值是字符串还是数组。

Answer 1

在本例中，我将使用正则表达式通过自定义筛选器进行检查。

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

演示：柱塞

Answer 2

这是一个想法，它不是一个有效的代码。如果在过滤器中传递参数，您可以将其写下来如下所示：

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>