title: AngularJS - hide parent element if children loop is empty (filtered)
body: <p>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 does a text comparison. Here is the example </p>
  
  <pre><code>&lt;div ng-repeat="group in groups"&gt;
    {{group.name}}
    &lt;div ng-repeat="material in materials | filter:filterByGroup(group) | filter:search "&gt;
      {{material.name}}
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Now, my problem is that when <code>filter:search</code> is applied and it filters out all the results in specific group, I would like to hide the group (and not leave the empty <code>group.name</code> hanging without child elements). </p>
  
  <p>I don't have the materials in the group it self, so I don't have that information in the parent ng-repeat scope. The question is if there is a way I can access the nested ng-repeat and see its count from the parent and hide the parent if that count is 0.</p>
  
  <p><strong>UPDATE</strong></p>
  
  <p>Here is a fiddle that better explains the situation: <a href="http://jsfiddle.net/ke793/">fiddle</a></p>
  
  <p>The main problem is that I don't want to associate my materials with groups. I could do that if nothing else works, but it sounds like an overload (since I would then need to basically filter the results twice) if I could do it by just checking the nested loop.</p>
  
  <p>Thanks</p>