我有如下定义的用户对象。
$scope.users = [{id: 1, name: 'Adam', friends: [{name: 'John', age: 21, sex: 'M'}, {name: 'Brad', age: 32, sex: 'M'}]}]
然后我有以下代码:
<div ng-repeat="user in users> <input type="text" ng-model="searchText"> <div ng-repeat="friend in user.friends | filter:searchText"> {{user.name}} {{friend.name}} {{friend.age}} </div> </div>
现在,当我在文本框中键入文本:“ searchText”时,我希望过滤器显示用户名和朋友的姓名/年龄。谁能帮助我做到这一点?
如果我是正确的话,那么我认为我需要为此创建一个自定义过滤器,或者还有其他方法可以完成此操作吗?
因为您想一次过滤两件事-朋友数组和用户的某些属性- 您需要创建自己的接受两个附加参数的自定义过滤器:
myApp.filter('myFilter', function() { return function(friends, searchText, username) { var searchRegx = new RegExp(searchText, "i"); if ((searchText == undefined) || (username.search(searchRegx) != -1)) { return friends; } var result = []; for(i = 0; i < friends.length; i++) { if (friends[i].name.search(searchRegx) != -1 || friends[i].age.toString().search(searchText) != -1) { result.push(friends[i]); } } return result; } });
然后像这样调用它:
<div ng-repeat="user in users"> <input type="text" ng-model="searchText"> <div ng-repeat="friend in user.friends | myFilter:searchText:user.name"> {{user.name}} {{friend.name}} {{friend.age}} </div> </div>
“:searchText:user.name”是将其他参数传递给自定义过滤器的方式。
小提琴。