Angular 6 index in material table not working

Question

I am having an issue when adding index to my table rows. I have assigned index value like this:

<ng-container matColumnDef="id">
  <mat-header-cell *matHeaderCellDef>#</mat-header-cell>
  <mat-cell *matCellDef="let i = index"> {{i+1}} </mat-cell>
</ng-container>

This solution is working on one table but on the second table it is returning NaN. Does anyone knows how to fix this?

On the second table I am using expandable rows so I have added multiTemplateDataRows attribute. Everything else is the same. I am using Material Design v7.11

Akhi Akl · Accepted Answer · 2018-12-17 09:30:37Z

18

As you are using multiTemplateDataRows property , you can't use index. Instead you have to use dataIndex or renderIndex.

<mat-cell *matCellDef="let i = renderIndex;">{{i+1}}</mat-cell>

answered Dec 17, 2018 at 9:30

Akhi Akl

3,9401 gold badge19 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Gandor Over a year ago

Thannk you! Adding dataIndex instead of index solved my issue.

Chatterji Neerugatti Over a year ago

Amidst of coronavirus. I found this. Thanks my friend.

Collectives™ on Stack Overflow

Angular 6 index in material table not working

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related