Angular ng-repeat skip element if it matches expression

Question

I am looking for a way to basically tell angular to skip an element in ng-repeat if it matches the expression, basically continue ;

In the controller:

 $scope.players = [{ name_key:'FirstPerson', first_name:'First', last_name:'Person' }, { name_key:'SecondPerson', first_name:'Second', last_name:'Person' }] 

Now in my template I want to show everyone that name_key='FirstPerson' does not match. I decided that these are filters, so I set up Plunkr to play with it, but no luck. Plunkr attempt

Answer 1

As @Maxim Shoustin suggested , the best way to achieve what you want is to use a custom filter.
But there are other ways: one of them is to use the ng-if directive on the same element if you put the ng-repeat directive (also here the plunker ):

 <ul> <li ng-repeat="player in players" ng-if="player.name_key!='FirstPerson'"></li> </ul> 

This may represent a minor aesthetic disadvantage, but it has the big advantage that your filtering can be based on a rule that is not so closely related to the players array and that can easily access other data in your application.

  <li ng-repeat="player in players" ng-if="app.loggedIn && player.name != user.name" ></li> 

Update
As said, this is one of the solutions to this problem and may or may not satisfy your needs.
As pointed out in the comments, ng-if is a directive that actually means that it can do more things in the background than you might expect. For example, ng-if creates a new scope from it :

The volume created in ngIf is inherited from its parent area using prototype inheritance.

This usually does not affect normal behavior, but to prevent unforeseen cases, you should keep this in mind before implementation.

Answer 2

I know this is old, but if someone is looking for another possible solution, here is another way to solve this problem - use the standard filter :

Object: a template object can be used to filter certain properties into objects contained in an array. For example {name: "M", phone: "1"}, the predicate returns an array of elements with a property name containing "M" and a phone with the content "1" .... The predicate can be canceled by prefixing the string with .. For example { name: The predicate "! M"} returns an array of elements that have a property name that does not contain "M".

So, for the TS example, something like this should do:

 <ul> <li ng-repeat="player in players | filter: { name_key: '!FirstPerson' }"></li> </ul> 

No need to write custom filters, no need to use ng-if with a new scope.

Answer 3

When implementing ng-repeat you can use a custom filter. Something like:

  data-ng-repeat="player in players | myfilter:search.name 

myfilter.js :

 app.filter('myfilter', function() { return function( items, name) { var filtered = []; angular.forEach(items, function(item) { if(name == undefined || name == ''){ filtered.push(item); } /* only if you want start With*/ // else if(item.name_key.substring(0, name.length) !== name){ // filtered.push(item); // } /* if you want contains*/ // else if(item.name_key.indexOf(name) < 0 ){ // filtered.push(item); // } /* if you want match full name*/ else if(item.name_key !== name ){ filtered.push(item); } }); return filtered; }; }); 

Demo Plunker