ngRepeat Filter by deep property

Question

If I have a complex object with objects as property values, how can I filter by one of the nested properties?

Can this be done with the OOB ng-repeat filter?

Data

{   Name: 'John Smith',   Manager: {      id: 123,      Name: 'Bill Lumburg'   } } 

ngRepeat

<li ng-repeat="e in emps | filter:Manager.Name">{{ e.Name }}</li> 

Answer 1

You need to pass in the argument to filter by:

<input ng-model="filter.key"> <ul>   <li ng-repeat="e in list | filter: {Manager: {Name: filter.key}}">     {{e.Name}}  (Manager: {{e.Manager.Name}})   </li> </ul> 

Example on Plunker

Answer 2

If you are filtering multiple properties then the syntax would be similar to below.

<ul>   <li ng-repeat="item in list | {filter: top_object_property_name: value, top_object_property_with_nested_objects_name: {nested_object_property_name: value}}">        ...   </li> </ul> 

eg:

        var employees = [name: 'John', roles: [{roleName: 'Manager'},{roleName: 'Supervisor'}]];          <li ng-repeat="staff in employees | {filter: name: 'John', roles: {roleName: 'Manager'}}">               ...         </li>