0

I have a <ul> of elements in html with roughly the structure as follows:

<ul id="ElementList">
  <li> Some element 1 </li>
  <li> Some element 2 </li>
  <li> Some element 3 </li>
  <li ng-repeat="element in someArray" ng-show = "SomeCondition"> element </li>
</ul>

I want to hide the Element list completely if there is no element after element 3 and show the complete list if there is any element seen after element 3. The array used for ng-repeat and the condition for ng-show above are something that I cannot make use of or rather understand how it works (comes from a third party) and hence can play around only with what is rendered. How can I do this?

labyrinth
  • 1,104
  • 3
  • 11
  • 32
  • Solved using answers for the question http://stackoverflow.com/questions/19664691/angular-js-how-to-count-ng-repeat-iterations-which-satisfy-the-custom-filter – labyrinth Jun 13 '15 at 09:24

1 Answers1

0

So, you want the list to be shown only if the array of elements is not empty, and if SomeCondition is true:

<ul id="ElementList" ng-show="someArray.length != 0 && SomeCondition">
JB Nizet
  • 678,734
  • 91
  • 1,224
  • 1,255
  • The condition clause here works on a particular element and not the array as a whole. So, say there 10 elements in the array but none of them meet the condition, they won't appear in the list and in this case, I do not want to show element 1, element 2 and element 3 also. – labyrinth Jun 12 '15 at 18:14
  • Then add a function to the controller scope that returns true if at least one element satisfies its condition. – JB Nizet Jun 12 '15 at 19:38
  • Making changes to the controller might make things very complicated for me. Is there any way, like say associate a model with the list elements and say check things against that model? – labyrinth Jun 12 '15 at 20:20