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>