AngularJS - hide parent element if children loop is empty (filtered)

Question

I have a case in which I have nested loops in which the child one is constructed by a filter function that takes parent as the argument. I also have another filter that just

Answer 1

A much cleaner solution was suggested HERE.

What you need to do is wrap the relevant area with an ng-show / ng-if based on an expression that applies the filter on the data structure and extracts length. Here is how it works in your example:

  

    

      {{group.name}}
      

        {{material.name}}
      
    
  

This allows you to hide complex structures once they are empty due to filtering, e.g. a table of results.