title: Nested ng-repeat with dynamic input
body: <p>I am trying to display a JSON response in a table using ng-repeat. The problem is that not all objects recieved are the same. All of them have a date, short message and long message. There are also ones with an additional value list, differing in length. This list should be diplayed underneath the long message within its own table or list. I use the <code>alert.slice().reverse()</code> because I want the newest entries to be on top. The new objects are inserted using <code>.push({values})</code>.</p>
  
  <pre><code>&lt;tbody class="AlTbody" ng-repeat="alerts in alerts.slice().reverse()" ng-class="className"&gt;
      &lt;tr class="Altr Aldate"&gt;
          &lt;td ng-show="{{alerts.Date}}"&gt;&lt;b&gt;{{alerts.Date}}:&lt;/b&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr class="Altr Alshort " ng-click="toggleDetail($index)"&gt;
          &lt;td&gt;{{alerts.S}}&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr class="Altr " ng-show="activePosition == $index"&gt;
          &lt;td class="msgL"&gt;{{alerts.L}}
              &lt;!-- 1)  &lt;p ng-show="{{item.List}}"&gt;&lt;br&gt;&lt;ul&gt;&lt;li&gt;Previous values:&lt;/li&gt; &lt;li ng-repeat="vals in ValueList"&gt;{{vals.value}}&lt;/li&gt;&lt;/ul&gt; &lt;/p&gt;--&gt;
              &lt;!-- 2)  &lt;p ng-show="{{List.txt}}"&gt; &lt;br&gt;&lt;ul&gt;&lt;li&gt;Previous values:&lt;/li&gt; &lt;li ng-repeat="List in alerts.List"&gt;{{List.txt}}&lt;/li&gt;&lt;/ul&gt; &lt;/p&gt;--&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p>I already tried two approaches as seen in the code. The first one displayed the list correct however it was displayed underneath every long message instead of only the one it belongs to. I used a new variable.</p>
  
  <pre><code>var l=valList.length;
  scope.List=true;
  while(l&gt;-1){
      scope.ValueList.push({value: valList[l]});
      l--;
  }
  </code></pre>
  
  <p>The second approach did not work at all because I could not find an index.</p>
  
  <pre><code> var l=valList.length;
         var indexV= jQuery.inArray(currdate,scope.alerts.Date);
          while(l&gt;-1){  
            scope.alerts[indexV].List.push({txt: valList[l]});
              l--;
          }
  </code></pre>
  
  <p>edit:
  This is the current <a href="https://i.stack.imgur.com/zo3oA.png" rel="nofollow noreferrer">output</a>. There you can see two objects( date, short message and long message) and both of them have the previous values section. However only the upper object is supposed to diplay the list of previous values. </p>