I have the following code:
<table>
<tr>
<ng-container *ngFor="let h of headers; let index = index">
<td>
<mat-form-field>
<mat-select [ngModel]="h" placeholder="Select type" (selectionChange)="selectType($event, h, index)">
<mat-option *ngFor="let h of headers" [value]="h">{{h}}</mat-option>
</mat-select>
</mat-form-field>
</td>
</ng-container>
</tr>
<ng-container *ngFor="let row of rows">
<tr>
<td *ngFor="let h of headers">
{{row[h]?.value || ''}}
</td>
</tr>
</ng-container>
</table>
How to change [ngModel]="h" on value that was changed in row[h]?
So if row["name"] comes to row["age"] the [ngModel]="h" should be 'age'.
Where headers is: ["age", "name"];
The rows is: [{"name": "Oleg"}, {"age": 17}]