Menu
Consider the following nested ng-repeat directives:
<tr ng-repeat="r in SomeExpr1">
<td ng-repeat="c in SomeExpr2">
<p>c index is {{$index}}, r index is {{???}}</p>
</td>
</tr>
How can I access the $index of the outer ng-repeat (i.e., the one in the parent scope that is hidden by the inner ng-repeat scope $index)?
641
The ngRepeat track by $index allows you to specify which items should be repeated using their index number. The ngRepeat is a directive that can be added to the HTML template of an Angular application. It is used for creating lists, and it can take an expression as an argument.
The ng-repeat directive instantiates a template once per item from a collection like array, list etc. In this blog, I am using nested ng-repeat to show the country list along with their city name. Create a project and install AngularJS from NuGet Package, add a script file to the project and write Angular code.
The $index variable is used to get the Index of an item repeated using ng-repeat directive in AngularJS. This article will explain how to use the $index of the row of HTML Table populated using ng-repeat directive in following two scenarios. 1. Get the Index inside the HTML Table cell using AngularJS. 2.
Technically $index is a “template variable” created by ng-repeat. It’s only accurate and has meaning inside the repeat block. When we pass the value out, it loses its context and it’s no longer valid.
As @Randal Schwartz pointed out in this post $parent does the trick.
<div ng-controller='demo-ctrl'>
<div ng-repeat="row in ctrl.matrix">
<div ng-repeat="column in row">
<span>outer: {{$parent.$index}} inner: {{$index}}</span>
</div>
</div>
</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
