Filter ng-repeat based on search input

Question

I have the following 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>

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

Tried:

  <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>

But I think that is an AND not an or.

Answer 1

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

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