Ng-repeat nested access to properties in the parent scope

In a project, a nested loop is required to output data from a two-dimensional table

Data

[    {        ID:1,        list:[            {                ID:1,                name:' li '            }        ]    } ,    {        ID:2,        list:[            {                ID:1,                name:' Ming '            }        ]    }]

Template page

<Divng-repeat= "C in obj">    <Divng-repeat= "A in C.list">        <spanng-if= "$first">{{$parent. $index}}</span>    </Div></Div>

Because you need access to the index values in the parent scope, you can get a reference to the parent scope through $parent

But every time we get the same value, I think about it for a while. I added a ng-if dynamically inserted DOM node. Ng-if inserts and deletes the DOM dynamically, a new scope is created, $parent. $index The actual mountain access is the second layer of ng-repeat $index variables;

Ng-if and ng-repeat are dynamic additions or deletionsof the DOM (based on this, there is no need to remember all the commands that can create scopes, and Directive, Ng-controller), so a new scope is created, as is the directive;

So like the code in front of me, to access the $index in the first level ng-repeat, you need to go up to the level

{{$parent. $parent. $index}}

Although it can be accessed, but if the hierarchy changes, we need to re-adjust, add or remove $parent, it seems to be very unfriendly.

Ng-repeat nested access to properties in the parent scope