根据搜索输入过滤ng-repeat [英] Filter ng-repeat based on search input

问题描述

我有以下html:

  <div>
    <div>
      <input type="text" placeholder="Search" ng-model="userSearch.firstname">
    </div>
  </div>

 <div>
   <div ng-repeat="user in users | filter:userSearch ">
     <div>
       {{user.firstname}} {{user.lastname}}
     </div>
   </div>
 </div>

因此，我有一个输入字段，用户可以在其中输入并搜索我所有用户的列表.有没有一种方法可以根据用户在搜索输入中输入的内容在ng-repeat中内联应用过滤器?

So I have an input field where the users can type and search in my list of all users. Is there a way I can apply a filter inline in the ng-repeat based on what the user types in the search input?

当前解决方案仅按名字过滤

Current solution only filters on firstname

我想同时过滤名字和姓氏

I would like to filter on both first and last name

尝试:

  <div>
    <div>
      <input type="text" placeholder="Search" ng-model="userSearch">
    </div>
  </div>

 <div>
   <div ng-repeat="user in users | filter:{firstname: userSearch, lastname: userSearch} ">
     <div>
       {{user.firstname}} {{user.lastname}}
     </div>
   </div>
 </div>

但是我认为这是AND，而不是or.

But I think that is an AND not an or.

推荐答案

将ng-model从userSearch.firstname更改为userSearch.

Change ng-model from userSearch.firstname to just userSearch.

 <input type="text" placeholder="Search" ng-model="userSearch">

http://jsbin.com/keyuno/1/edit?html,js,output

或者，您可以将filter:userSearch更改为filter:userSearch.firstname.您只需要确保过滤器与模型匹配即可.

Alternatively you could change filter:userSearch to filter:userSearch.firstname. You just need to be sure the filter matches the model.

这篇关于根据搜索输入过滤ng-repeat的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！