I need your help, guys!
I am developing a User Administrator for a forums app with Angular. In a section i have an Angular Material multi option select like this:
I am getting the options on the select from my MySQL DB, each option is a field or column in my DB, i am also bringing the value of each column in each user register, for example, "autoevaluacion" = true.
what i want to achieve is that every checbox in the multi option select get checked if the value is true or get in blank if its false.
How can i do that?
I tried to do it with the following code but checkboxes dont get checked, just the option appear as you can see in the previous pic.
HTML
<ng-container matColumnDef="foros">
<th mat-header-cell *matHeaderCellDef style="text-align: center;align-items: center">Foros</th>
<td mat-cell *matCellDef="let element">
<mat-form-field>
<mat-label>Foros</mat-label>
<mat-select [formControl]="toppings" multiple>
<mat-option *ngFor="let dato of element.optionsForos" [value]="dato.val"></mat-option>
</mat-select>
</mat-form-field></td>
</ng-container>
TS File
public transfromData(datos: Array<any>){
return datos.map(dato => {
dato["optionsForos"] = [
{
val: dato.autoevaluacion,
label: "Autoevaluacion"
},
{
val: dato.rt_funcionarios,
label: "RT_Funcionarios"
},
{
val: dato.reporteadores,
label: "Reporteadores"
},
{
val: dato.reporteadores_gerentes,
label: "Reporteadores_Gerentes"
},
{
val: dato.rt_gerentes,
label: "RT_Gerentes"
},
{
val: dato.contrato_funcionarios,
label: "Contratos_Funcionarios"
},
{
val: dato.rt_jefes,
label: "RT_Jefes"
},
{
val: dato.contrato_gerentes,
label: "Contrato_Gerentes"
},
] ;
console.log(dato)
return dato;
});
}
public async obtenerUsuarios(){
let data;
this.tablaUsuarios = await this.forosServicio.getUsuarios(data);
console.log(this.tablaUsuarios)
this.tablaUsuarios = this.transfromData(this.tablaUsuarios);
this.dataSource = new MatTableDataSource<any>(this.tablaUsuarios);
console.log(this.dataSource)
}
Aucun commentaire:
Enregistrer un commentaire