重复跳过与表达式匹配的项目

我正在寻找一种方法,基本上告诉角跳过一个项目在一个 n- 重复,如果它匹配一个表达式,基本上 continue;

控制器:

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

现在,在我的模板,我想显示每个人,不匹配 name_key='FirstPerson'。我认为它必须是过滤器,所以我设置了一个 Plunkr 玩它,但没有任何运气。普朗克企图

95181 次浏览

You can use custom filter when you implement ng-repeat. 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

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

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

This may present a minor disadvantage from an estetical perspective, but has a major advantage that your filtering could be based on a rule that is not as tight coupled to the players array and that can easily access other data in your app's scope:

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

Update
As stated, this is one of the solutions for this kind of problem and may or may not suit your needs.
As pointed out in the comments, ng-if is a directive, which actually means that it might do more things in the background than you might expect.
For example, ng-if creates a new scope from it's parent:

The scope created within ngIf inherits from its parent scope using prototypal inheritance.

This usually doesn't affect the normal behaviour but in order to prevent unexpected cases, you should keep this in mind before implementing.

I know this is an old one, but in case someone would look for another possible solution, here is another way to solve this - use standard filter functionality:

Object: A pattern object can be used to filter specific properties on objects contained by array. For example {name:"M", phone:"1"} predicate will return an array of items which have property name containing "M" and property phone containing "1". ... The predicate can be negated by prefixing the string with !. For example {name: "!M"} predicate will return an array of items which have property name not containing "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 it's new scope.