AngularJS 只过滤某些对象答案

【问题标题】：AngularJS filter only on certain objectsAngularJS 只过滤某些对象
【发布时间】：2012-11-28 15:40:51
【问题描述】：

我的用户对象定义如下。

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

我有以下代码：

<input type="text" ng-model="searchText">
<div ng-repeat="friend in user.friends | filter:searchText">
  {{friend.name}} {{friend.age}}
</div>

每当我在这里搜索时，我都会得到姓名、年龄和性别的结果。但我只想搜索姓名和年龄，我不想搜索性别。谁能帮助我实现这一目标？

【问题讨论】：

你能用你想要的示例查询和结果更新你的问题吗？在您的评论（如下）中，您希望一个输入字段搜索多个字段，但您希望能够输入什么类型的查询？

标签： angularjs javascript-framework

【解决方案1】：

如果你可以有两个搜索字段，你可以传递一个对象作为第二个参数来实现这一点

<div ng-repeat="friend in user.friends | filter:{name:searchNameText, age:searchAgeText}">

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

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

【讨论】：

非常感谢瑞克！但我不能有两个搜索字段。你能帮我解决一下如何使用相同的字段吗？

【解决方案2】：

我不确定这是否是您所追求的。如果你想让一个输入字段匹配多个属性，你需要一个过滤函数来传递给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());
};

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

【讨论】：

非常感谢弗雷德里克！是的，这就是我要找的！但我在这里遇到了问题。我总是得到 $scope.searchText undefined。我只得到控制器内部定义的函数和变量作为 $scope 的选项，而不是在 $scope 中得到 ng-model=searchText。
$scope.searchText 将是未定义的，直到您在输入字段中输入了一些内容。你能用你正在使用的完整代码更新你的问题吗？
有没有办法在搜索中包含特殊字符。如果我输入“？”在搜索字段中它会抛出错误'无效的正则表达式：/？/：没有重复'

【解决方案3】：

这不是完成您想要的最干净的方法，但它是使用标准 ng-repeat 过滤器完成 OR 过滤器的最简单方法。

控制器：

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

$scope.buildSearchData = buildSearchData;

function buildSearchData(friend){
    return friend.name + ' ' + friend.age;
}

HTML

<input type="text" ng-model="searchText">
<div ng-repeat="friend in user.friends | filter:{searchData:searchText}"
     ng-init="friend.searchData = buildSearchData(friend)">
  {{friend.name}} {{friend.age}}
</div>

【讨论】：

【解决方案4】：

"user.friends 中的好友 | json | filter:{something:somethingtext}"

http://docs-angularjs-org-dev.appspot.com/api/ng.filter:json

【讨论】：

【解决方案5】：

另一种可能的方法是创建一个聚合字段，其中包含您要在连接上过滤的所有字段的值，并且仅对其进行过滤。

【讨论】：

我不喜欢这个答案，但它是迄今为止最简单的。感谢发帖