Mat-Table matCellDef issue with mapping model which has special character

Question

The data I got from a different REST API has field names with special characters and spaces in between them.

For example, instead of passing row.DatasetID like this:

<ng-container matColumnDef="ID">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>ID</th>
    <td mat-cell *matCellDef="let row">{{row.DatasetID}}</td>
</ng-container>

I would like to pass it like this:

<ng-container matColumnDef="ID">
    <th mat-header-cell *matHeaderCellDef mat-sort-header>ID</th>
    <td mat-cell *matCellDef="let row">{{row.'Dataset ID'}}</td>
</ng-container>

How can I format the mapping if the return proper/field name has space or special characters like "@"?

Answer 1

Square brackets to the rescue:

{{ row['Dataset ID'] }}