AngularJS過濾器 - 具有'或'關係的兩個過濾器

Question

只是想知道：在AngularJS中，是否有一種本地方式來過濾，使其具有'或'關係而不是'和'？

例如：

<tr ng-repeat="account in accounts | filter1 *OR* filter2 *OR* filter3" > 

因此，如果任何過濾器相匹配，則它返回該對象。截至目前，三人都必須通過才能出現。

非常感謝， ÿ

Answer 1

你可以寫一個自定義過濾器。它可以接受其他過濾器的名稱並檢查其中每個過濾器的名稱，以查看accounts陣列中的每個項目是否與任何過濾器有效匹配。下面的示例演示樣的想法，認爲我沒有真正運行代碼，看看它的工作原理，所以請原諒我的拼寫錯誤：

app.filter('anyOf', function($filter) { 
    return function(){ 
     var array = arguments[0]; 
     var result = []; 
     angular.forEach(array, function(item){ 
      for(var i=1; i<arguments.length; i++){ 
       var filter = $filter(arguments[i]); 
       if(filter([item]).length){ 
        result.push(item); 
        break; 
       } 
      } 
     }); 
     return result; 
    } 
}); 

然後你可以使用它像這樣：

<tr ng-repeat="account in accounts | anyOf:'filter1':'filter2':'filter3'" > 

我認爲它應該能夠工作，儘管它不是非常有效，因爲它將輸入數組中的每個項目與任何過濾器進行檢查。但是，如果你的賬戶數組不是很長，那可能會起作用。

Answer 2

您可以使用$ filter在您自己的代碼中調用過濾器，以便您可以將過濾器名稱作爲參數傳遞給新過濾器以合併結果(JSFIDDLE)。

app.filter('merge', function($filter) { 
    return function(input, extra) { 
     var result = []; 
     for (var i = 1; i < arguments.length; i++) { 
      angular.forEach($filter(arguments[i])(input), function(item) { 
       if (result.indexOf(item) < 0) { 
        result.push(item); 
       } 
      }); 
     } 
     return result; 
    }; 
}); 

而且，您可以將參數傳遞給你的過濾器是這樣的：

<ul> 
    <li ng-repeat="item in items|merge:'color':'rating'"> 
     {{item.rating}}: {{item.color}} 
    </li> 
</ul> 

如果你想傳遞參數給你歸併的過濾器，你可以自己分析它們在合併篩選：

<h3>Merge brown and rating >= 5</h3> 
<ul> 
    <li ng-repeat="item in items|mergeWithArgs:['color','brown']:['rating',5]"> 
     {{item.rating}}: {{item.color}} 
    </li> 
</ul> 

代碼：

app.filter('mergeWithArgs', function($filter) { 
    return function(input) { 
     console.dir(arguments); 
     var result = []; 
     for (var i = 1; i < arguments.length; i++) { 
      var params = arguments[i]; 
      var filter = $filter(params[0]); 
      // remove filter name, prepend input 
      params.splice(0, 1, input); 
      angular.forEach(filter.apply(this, params), function(item) { 
       if (result.indexOf(item) < 0) { 
        result.push(item); 
       } 
      }); 
     } 
     return result; 
    }; 
});