Error: cdk-table: Could not find column with id. Angular 2 Material Data Tables

Same error occurs if the matColumnDef directive value doesn't match with columns object (typically named as displayedColumns) ex:

<ng-container matColumnDef="profileStatus">
  <th mat-header-cell *matHeaderCellDef mat-sort-header>Status</th>
  <td mat-cell *matCellDef="let row">{{ row?.profileStatus }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>

    displayedColumns: string[] = [
       'status'
  ];

Here the 'status' and 'profileStatus' don't match then also this error kicks in. To fix the names have to match


Displayed columns array should match with the datasource.

displayedColumns = ['garageName', 'address', 'status', 'slots'];

displayedColumns Names should Match with matColumnDef Names under ngContainer not as stated above You can have any name within your model/Array