根据搜索输入过滤ng-repeat

时间:2015-01-22 02:02:13

标签: angularjs angularjs-ng-repeat angularjs-filter

我有以下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中应用内联过滤器?

当前解决方案仅过滤名字

我想过滤名字和姓氏

尝试:

  <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而非一个或。

1 个答案:

答案 0 :(得分:10)

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

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

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

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