Multiple parameters angular filter inside ng-repeat

Question

I'm trying to make a filter inside a ng-repeat based on a custom filter that receives two parameters. At the same time, one of those parameters is one property of the object on the repeat.

So in my ng-repeat code I have:

<tr ng-repeat="player in myTeam | bitwiseAnd:{firstNumber: player.Flag, secondNumber: type}">

But it's not working. If I debug it, the filter is receiving in the first parameter undefined.

I've read the documentation : https://docs.angularjs.org/guide/filter

I've read also multiple related questions in SO

Without success.

I've created a plunker where we can see how the filter is working properly when I use it as an expression, so probably the problem is sending the values inside the ng-repeat statement.

Here is the plunker: http://plnkr.co/edit/IGvDBq?p=preview

Thanks for your time

a better oliver a better oliver · Accepted Answer · 2014-08-28T17:25:12

myTeam | bitwiseAnd applies the bitwise filter to the team array as a whole, not the players. So the effect is like writing

<tr ng-repeat="player in true">

if the filter returns true. What you want is a filter that returns an array. You can create your own filter or use the filterfilter. The latter one is tricky to combine with yours, but it's possible. At first you define a predicate function in your controller

$scope.bitwiseAnd = function(type) {
  return function(player) {
    return $filter('bitwiseAnd')(player.Flag, type);
  }
}

That function applies your bitwiseAnd filter and is itself applied on every player. Then you use the filterfilter with that function:

<tr ng-repeat="player in myTeam | filter:bitwiseAnd(type)>

Working Plunker

Multiple parameters angular filter inside ng-repeat

2 Answers