Question

我们有一个搜索输入，可以通过两个属性过滤数据：name和id

<input ng-model="query.name">
<input ng-model="query.id">

<div ng-repeat="item in items | filter:query"></div>

如何在一个简单的输入模型

中完成此操作

提前致谢

Answer 1

没有尝试过，但它看起来像是来自的文档 https://docs.angularjs.org/api/ng/filter/filter 你可以做这样的事情：

<input ng-model="query.$">

请参阅页面上的最后一个示例以及讨论过滤器“expression”参数的“Object”版本的部分。

Answer 2

非常简单，你几乎就在那里：

<input ng-model="query">
<div ng-repeat="item in items | filter:query">{{item}}</div>

这样您只需要一个ng模型进行过滤。

-
修改

如果您的对象中有更多不希望被过滤的属性，则可以使用{{>>功能或自定义过滤器，来自{{ 3}}：

{{ filter_expression | filter : expression : comparator}}
Expression可以是：string，Object或function()

我已经更新了小提示，以演示如何使用功能和自定义过滤器进行过滤： documentation

Answer 3

您可以使用angular-filter轻松解决此问题。

https://github.com/a8m/angular-filter

<强> CONTROLLER

$scope.users = [
  { first_name: 'Sharon', last_name: 'Melendez' },
  { first_name: 'Edmundo', last_name: 'Hepler' },
  { first_name: 'Marsha', last_name: 'Letourneau' }
];

HTML

<input ng-model="search" placeholder="search by full name"/>
<th ng-repeat="user in users | searchField: 'first_name': 'last_name' | filter: search">
  {{ user.first_name }} {{ user.last_name }}
</th>
<!-- so now you can search by full name -->

就这么简单。

祝你好运。

如何根据angularjs中的一个输入模型过滤多个属性

3 个答案: