我正在寻找一种方法,基本上可以告诉 angular,如果 ng-repeat 中的某个项目与某个表达式匹配,就跳过该项目,基本上就是 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 来玩玩,但没有任何收获。Plunkr尝试
正如 @Maxim Shoustin所建议的,要实现您的愿望,最好的办法是使用自定义过滤器。
但也有其他方法,其中之一就是在放置ng-repeat
指令的同一元素上使用ng-if
指令(另外,这里还有 plunker):
<ul>
<li ng-repeat="player in players" ng-if="player.name_key!='FirstPerson'"></li>
</ul>
从外观上看,这可能是一个小缺点,但它有一个很大的优点,即您可以根据规则进行过滤,而不需要与 players
数组紧密耦合,并且可以轻松访问应用程序范围内的其他数据:
<li
ng-repeat="player in players"
ng-if="app.loggedIn && player.name != user.name"
></li>
更新
如前所述,这是解决此类问题的***方法之一,可能适合您的需要,也可能不适合您的需要。
正如评论中指出的,"ng-if "是一个指令,这实际上意味着它在后台做的事情可能比你想象的要多。
例如,ng-if
从它的父类创建一个新的作用域:
在 ngIf 中创建的作用域使用原型继承从其父作用域继承。
这通常不会影响正常行为,但为了防止意外情况的发生,您应该在实现之前牢记这一点。
我知道这是一个老问题,但为了防止有人寻找其他可能的解决方案,这里有另一种解决方法--使用标准 filter 功能:
对象:*模式对象可用于过滤数组包含的对象上的特定属性。 数组包含的对象的特定属性。例如 {name:"M", phone:"1"} 谓词将返回一个数组,其中包含属性名称
包含 "M" 和属性 phone 包含 "1" 的数组。**谓词 例如 {name: "!M"} 谓词将返回一个数组,其中包含属性名为 不包含 "M" 的数组。
因此,在 TS 的示例中,应该这样做:
<ul>
<li ng-repeat="player in players | filter: { name_key: '!FirstPerson' }"></li>
</ul>
无需编写自定义过滤器,也无需使用带有新范围的 ng-if
。
在执行 ng-repeat
时,您可以使用自定义过滤器。比如
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