Issue
This Content is from Stack Overflow. Question asked by Eden Cohen
I want to create a table that displays the form in angular that the user can choose in each row one option, for that, I implement mat-table, and in each cell there is mat-radio-button
but I don’t know where to insert the so the user can choose from each row one option
rate-selector.component.html:
<table mat-table [dataSource]="dataSource" class="mat-elevation-z8">
<ng-container matColumnDef="Rate">
<th mat-header-cell *matHeaderCellDef> Rate </th>
<td mat-cell *matCellDef="let element">
{{element.rate}}
</td>
</ng-container>
<ng-container matColumnDef="Basic">
<th mat-header-cell *matHeaderCellDef> Basic </th>
<td mat-cell *matCellDef="let element">
<mat-radio-button value={{element.basic}}></mat-radio-button>
</td>
</ng-container>
<ng-container matColumnDef="Enable">
<th mat-header-cell *matHeaderCellDef> Enable </th>
<td mat-cell *matCellDef="let element">
<mat-radio-button value={{element.enable}}></mat-radio-button>
</td>
</ng-container>
<ng-container matColumnDef="Disable">
<th mat-header-cell *matHeaderCellDef> Disable </th>
<td mat-cell *matCellDef="let element">
<mat-radio-button value={{element.disable}}></mat-radio-button>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns">
</tr>
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
</table>
Solution
This question is not yet answered, be the first one who answer using the comment. Later the confirmed answer will be published as the solution.
This Question and Answer are collected from stackoverflow and tested by JTuto community, is licensed under the terms of CC BY-SA 2.5. - CC BY-SA 3.0. - CC BY-SA 4.0.