CODEWITHSUNDEEP
dartangular-dart
Patrice Chalin
Patrice Chalin

Reputation: 16100

Access outer $index when ng-repeat are nested in AngularDart

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)?

Upvotes: 10

Views: 5173

Answers (2)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657018

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>

Upvotes: 17

Randal Schwartz
Randal Schwartz

Reputation: 44046

You need ng-init from Angular.js. Sadly, that hasn't been ported yet, but it would look like this if it worked:

<script>
  function Ctrl($scope) {
    $scope.list = [['a', 'b'], ['c', 'd']];
  }
</script>
<div ng-controller="Ctrl">
  <div ng-repeat="innerList in list" ng-init="outerIndex = $index">
    <div ng-repeat="value in innerList" ng-init="innerIndex = $index">
       <span class="example-init">list[ {{outerIndex}} ][ {{innerIndex}} ] = {{value}};</span>
    </div>
  </div>
</div>

(via http://docs.angularjs.org/api/ng/directive/ngInit)

Upvotes: 5

Related Questions