AngularJs: Searching using filter option is not working properly

Question

I have a issue with Filter text in angularjs.

I have a contacts JSON array called "users"

[{ "contactId": 1, "contactName": "Anil", "contactEmail": "[email protected]", "contactMobile": "1111111111" }, { "contactId": 2, "contactName": "Pankaj", "contactEmail": "[email protected]", "contactMobile": "2222222222" }, { "contactId": 3, "contactName": "John", "contactEmail": "[email protected]", "contactMobile": "333444555" }]

HTML for search filter

<div>
  <label>Name:</label>
  <input type="text" ng-model="nameFilter" placeholder="Enter a name here">
  <hr>
  <h1>Hello {{nameFilter}}!</h1>
<ul ng-controller='MyController'>
    <li ng-repeat="user in users | filter:nameFilter">{{ user.contactName }}</li>
</ul>
</div>

In the HTML I am printing only contactName because I want to filter only "Name" using above textbox, not contactEmail or contactMobile... but the filter option is filtering data with contactEmail and contactMobile also because of JSON has those objects.... but without removing json objects(contactEmail and contactMobile) from JSON array how can I filter data with only contactName.

Answer 1

You can use object instead of String for the key. See: http://docs.angularjs.org/api/ng.filter:filter

<input type="text" ng-model="nameFilter.contactName" placeholder="Enter a name here">