CODEWITHSUNDEEP
javascriptarraysangularjs
Gerixxx
Gerixxx

Reputation: 47

Iterating an array of arrays in AngularJS with ng-repeat

I've a serious problem with iterating an array (list) in AngularJS.
The structure of the array is -> items{ var1, var2, array2[var3, var4] }.
I want to display this array on a HTML page in a table with ng-repeat as follows:

<tr ng-repeat="item in items">
   <td >{{item.var1}}</td>
   <td >{{item.var2}}</td>
   <td ng-repeat="...">###</td>
</tr>

and in the place of "###" I need to display array2's variables after the right ng-repeat dercription, but I don't know the right syntax for this case. I have tried many solutions, but none of them was helpful.

Thanks for answers! :-)

Upvotes: 1

Views: 1982

Answers (4)

aarosil
aarosil

Reputation: 4898

You had it right, it's as easy as nesting the ng-repeat, just use the first ng-repeated item's array property as the model for the nested one:

Try this, as I mentioned in my comment:

< td ng-repeat="subitem in item.array2">{{subitem}}< /td >

Upvotes: 0

k88074
k88074

Reputation: 2164

You should just iterate in item.array2, as you did in the first ng-repeat, something like:

<tr ng-repeat="item in items">
    <td >{{item.var1}}</td>
    <td >{{item.var2}}</td>
    <td ng-repeat="item_ in item.array2">
         {{item_}}
    </td>
</tr>

I have not tried, but it should work.

Upvotes: 1

A.B
A.B

Reputation: 20455

use this code, here i refers to each nested array item in item.array2 

      <tr ng-repeat="item in items">
    <td >{{item.var1}}</td>
   <td >{{item.var2}}</td>
   <td ng-repeat="i in item.array2">{{i}}</td>
</tr>

Upvotes: 1

Oakley
Oakley

Reputation: 666

Nested ng-repeats can lead to performance problems. If the inner array is strings or numbers, consider using something like:

  <div ng-repeat="inner in outer">
         {{inner.join(',')}}
<div>

Upvotes: 1

Related Questions