CODEWITHSUNDEEP
javascriptangularjs
MrVoodoo
MrVoodoo

Reputation: 1083

Increment counter within ng-repeat in AngularJS

I have two nested ng-repeat and would like to access both the outer and inner indexes.

<div ng-repeat="column in columns" ng-init="columnIndex = $index">
     <div ng-repeat="row in column" ng-init="rowIndex = $index">
          <p ng-click="delete(column, row)">
              Delete
          </p>
     </div>
</div>

Now, this works fine as long as the outers model isn't updated. Apparently, ng-init initializes the values only once so columnIndex and rowIndex will not be update accordingly if I delete one element on the page.

Is there an other way to keep track of the outer and inner index so the correct values can be passed to the delete function?

Upvotes: 2

Views: 2714

Answers (1)

Numyx
Numyx

Reputation: 1758

You can set a name for each ng-repeat index:

<div ng-repeat="(columnIndex, column) in columns">
    <div ng-repeat="(rowIndex, row) in column">
        <p ng-click="delete(column, row)">
            Delete
        </p>
    </div>
</div>

Alternatively you can use $index for the inner index and $parent.$index for the outer index.

Upvotes: 3

Related Questions