I am having trouble adjusting the sample material data table to accommodate my own data...
This is how my data is structured:
export const DATA: any = {
'products': [
{
'id': 1,
'name': 'SOLID BB T-SHIRT',
'price': '28.00',
...
},
...
]
In contrast, the example provided by Material.angular.io has their data formatted like this:
export const DATA = [
{
"id": 1,
"name": "Leanne Graham",
"username": "Bret",
...
},
...
]
Despite my best efforts, I can't seem to get my data structure to align properly for use in the HTML interpolation as demonstrated here:
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef> id </th>
<td mat-cell *matCellDef="let element"> {{element.id}} </td>
</ng-container>
Is there something crucial that I am overlooking?