Angular Material - Getting index of row in data table

Issue

I am using the MatTable component from Angular Material to make a dynamic data table.

I need to get the current position of a row. I can easily get the row on which the user clicked but I am unable to know its current position in the list (which depends on sort/filtering/pagination).

Any idea?

Solution

in your mat-cell you can get index like *ngFor as below

<mat-cell *matCellDef="let element;let i = index;">
        {{ i }}
</mat-cell>

Update from Angular 5 use also index as i

<ng-container matColumnDef="rowIndex">
  <th mat-header-cell *matHeaderCellDef> Index </th>
  <td mat-cell *matCellDef="let element;index as i;"> {{ i }} </td>
</ng-container>

• index: number: The index of the current item in the iterable.
• first: boolean: True when the item is the first item in the iterable.
• last: boolean: True when the item is the last item in the iterable.
• even: boolean: True when the item has an even index in the iterable.
• odd: boolean: True when the item has an odd index in the iterable.

Answered By - ElasticCode