How to get index in nested ng repeats

I have ng-repeat in ng repeat. I am tyring to get the index at both levels, but I can not:

<tbody> <tr ng-repeat="element in body"> <td ng-repeat="h in header" style="width:{{h.width}}px"> <div col="{{$parent.$parent.$index}}" row="{{$parent.$index}}">{{element[h.column]}}</div> <td> </tr> </tbody> 

here also plnkr. http://plnkr.co/edit/dGoN43HzQefVpCsp2R3j

RESEARCH - This "col" value is never populated. It does not fix the index. Can anyone help

+7
angularjs
source share
1 answer

You do not need to use $parent , just use $index to get the index of the inner loop and use indexOf () . array function to get the outer loop index ...

HTML

 <tr ng-repeat="element in body"> <td ng-repeat="h in header" style="width:{{h.width}}px"> <div col="{{body.indexOf(element)}}" row="{{$index}}">{{element[h.column]}}</div> <td> </tr> 

UPDATE

In fact, using ng-init it would be much better to get the index of the outer loop ... here you can easily set rowIndex to the current index at each step and use it in the inner loop ...

  <tbody> <tr ng-repeat="element in body" ng-init="rowIndex = $index"> <td ng-repeat="h in header" style="width:{{h.width}}px"> <div col="{{$index}}" row="{{rowIndex}}">{{element[h.column]}}</div> <td> </tr> </tbody> 

here is updated PLUNKER

+12
source share

All Articles