I'm facing a challenge with a table that has multiple columns and a checkbox for one of the columns.
Table layout:
https://i.sstatic.net/qKZHt.png
I attempted to assign some formControlName to the checkbox within the table, but I received an error in the console stating that there is "no value accessor for form control".
<nz-table #filterTable [nzLoading]="loading" nzTitle="Assign a new role to the group" nzBordered>
<thead nzSingleSort>
<thead>
<tr>
<th nzShowSort nzSortKey="module">Module</th>
<th></th>
<th nzShowFilter [nzFilters]="filterrole" (nzFilterChange)="updateFilter($event)">Role</th>
<th style="min-width: 120px;">Action</th>
</tr>
</thead>
<tbody>
<ng-container *ngFor="let module of listofmodules">
<tr *ngFor="let role of module.role">
<td>{{module.module}}</td>
<td nzShowCheckbox [(nzChecked)]="role.checked" (nzCheckedChange)="refreshStatus(module.id, role)" name='tableCheck'
id='tableCheck'>
</td>
<td>{{role}}</td>
<td><a>View</a></td>
</tr>
</ng-container>
</tbody>
</nz-table>
There is a submit button to send the values to the backend. In the (click) function of the submit button, I am using
const formObj = this.validateForm.getRawValue();JSON.stringify to convert it to JSON format.
I am looking to retrieve the value of the checkbox in the table. How can I achieve this?
EXPECTED RESULT
{"moduleid": "testing group 1", "roleheck":"Supervisor"}