La etiqueta <tr ...></tr> es en realidad la fila del encabezado y no la celda del encabezado. Ahora, el índice de cada celda de encabezado dentro de la tabla depende del orden de las columnas displayedColumns , según el caso de uso, puede cambiar dinámicamente o no. Una solución codificada podría ser perfectamente válida ya que en muchos casos no sucederá el reordenamiento de las columnas.

 <table mat-table [dataSource]="dataSource"> <!-- Weight Column --> <ng-container matColumnDef="weight"> <th mat-header-cell *matHeaderCellDef (click)="showIndex('weight')"> Weight </th> <td mat-cell *matCellDef="let element" (click)="showIndex('weight')"> {{element.weight}} </td> </ng-container> <!-- ... --> <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr> <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr> </table>

En escenarios donde las columnas mostradas cambian, la showIndex(columnName: string) puede mostrar/devolver el índice de la columna de la siguiente manera

 displayedColumns: string[] = ['weight','...']; showIndex(columnName: string): void { const index = this.displayedColumns.indexOf(columnName); console.log(index); alert(index); }