在 AngularJS 中使用单个输入过滤多个字段 [英] filter multiple fields using single input in AngularJS
本文介绍了在 AngularJS 中使用单个输入过滤多个字段的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个 JSON 对象,如下
I have a JSON object which is as follows
[{
"id": 1,
"firstName": "Jennifer",
"middleName": null,
"lastName": "Aniston",
"address": "New York City",
}, {
"id": 2,
"firstName": "Angelina",
"middleName": null,
"lastName": "Jolie",
"address": "Beverley Hills",
}, {
"id": 3,
"firstName": "Emma",
"middleName": null,
"lastName": "Watson",
"address": "London",
}]
我正在使用 ng-repeat 在视图中填充这些数据.
I'm populating this data in view using ng-repeat.
<td ng-repeat="row in list | filter:filterBeauties">
{{row.firstName}} {{row.lastName}}
</td>
现在我有一个输入框,我想用它来过滤这些名称.我想使用相同的输入框过滤 firstName,然后过滤 lastName,不过滤任何其他内容(例如地址).
Now I have an input box which I'd like to use to filter these names. I would like to use same input box to filter firstName and then filter lastName and don't filter anything else (eg. address).
<input type="text" placeholder="Filter" ng-model="filterBeauties.firstName">
知道如何实现它吗?
推荐答案
好的 所以这就是我为解决它所做的.
Okay So this is what I did to solve it.
我在 json 对象中添加了一个新项目(使用 angular.forEach 函数)并由它过滤.
I added a new item in json object (using angular.forEach function) and filtered by it.
$scope.list = beauties.query(function(response) {
angular.forEach(response, function(value, key) {
var fullName = value.firstName + ' ' + value.lastName;
$scope.list[key].fullName = fullName;
});
});
输入框代码:
<input type="text" placeholder="Filter" ng-model="filterBeauties.fullName">
ng-repeat
<td ng-repeat="row in list | filter:filterBeauties">
{{row.firstName}} {{row.lastName}}
</td>
这篇关于在 AngularJS 中使用单个输入过滤多个字段的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文