Counter for ngFor nested loops in Angular2

Question

I have two nested * ngFor loops in Angular2. I want to maintain a counter that increments every time the code in the center of the loops repeats.

The counter should go from 0 to the number of settings times more blades

<tr *ngFor="let adjustment of adjustments"> <td *ngFor="let blade of blades"> <span> Counter = ????????? </span> </td> </tr> 

Answer 1

Add a counter variable to both * ngFor statements, say i and j, then do the math as an expression. Here is the code:

  <tr *ngFor="let adjustment of adjustments; let i = index"> <td *ngFor="let blade of blades; let j = index"> <span> Counter = {{ (i * blades.length) + j }} </span> </td> </tr>