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?

Answer 1

To filter with multiple deep property we need to create custom filter. What i mean we need to create our own function to filter the data in object and return the required object(filtered object).

For example i need to filter data from below object -

[
{
   "document":{
      "documentid":"1",
      "documenttitle":"test 1",
      "documentdescription":"abcdef"
       }
},
{
   "document":{
      "documentid":"2",
      "documenttitle":"dfjhkjhf",
      "documentdescription":"dfhjshfjdhsj"
       }
}
]

In HTML we use ng-repeat to show document list -

   //search input textbox
   
 

   //our html code 

In Controller we write filter function to return filtered object by using two properties of object which are "documenttitle" and "documentdescription", code example is as below -

function filterDocuments(document)
        {
            if($scope.searchDocument)
            {
                     if(document.documentTitle.toLowerCase().indexOf($scope.searchDocument.toLowerCase()) !== -1 || document.document.shortDescription.toLowerCase().indexOf($scope.searchDocument.toLowerCase()) !== -1)
                {
                    //returns filtered object
                    return document
                }
            }else {
               return document;
            }
        }

Where $scope.searchDocument is the scope variable which binded to the search textbox (HTML input tag) in which user can input the text to search.