AngularJS仅过滤某些对象

Sab*_*kar 17 javascript-framework angularjs

我有如下定义的用户对象.

$scope.user = [{id: 1, friends:
    [
        {name: 'John', age: 21, sex: 'M'},
        {name: 'Brad', age: 32, sex: 'M'}
    ]
}]
Run Code Online (Sandbox Code Playgroud)

我有以下代码:

<input type="text" ng-model="searchText">
<div ng-repeat="friend in user.friends | filter:searchText">
  {{friend.name}} {{friend.age}}
</div>
Run Code Online (Sandbox Code Playgroud)

每当我搜索时,我都会得到姓名,年龄和性别的结果.但我想只搜索姓名和年龄,我不希望性别可以搜索.任何人都可以帮我解决这个问题吗?

ric*_*ick 21

如果可以有两个搜索字段,则可以将对象作为第二个参数传递以实现此目的

<div ng-repeat="friend in user.friends | filter:{name:searchNameText, age:searchAgeText}">
Run Code Online (Sandbox Code Playgroud)

否则,您需要编写自定义过滤器以对两者使用相同的字段,或者将自定义过滤器函数作为文档中描述的第三个参数传递.

http://docs.angularjs.org/api/ng.filter:filter

  • 顺便说一句,这将执行AND搜索,而不是你可能希望的OR ... (8认同)

fre*_*rik 16

我不确定这是不是你想要的.如果要使一个输入字段匹配多个属性,则需要传递过滤函数filter.

$scope.user = {id: 1, friends: [{name: 'John', age: 21, sex: 'M'}, {name: 'Brad', age: 32, sex: 'M'}, {name: 'May', age: 64, sex: 'F'}]};

$scope.searchFilter = function (obj) {
    var re = new RegExp($scope.searchText, 'i');
    return !$scope.searchText || re.test(obj.name) || re.test(obj.age.toString());
};
Run Code Online (Sandbox Code Playgroud)

这是一个小提琴示例 http://jsfiddle.net/fredrik/26fZb/1/