Estoy desarrollando una app en Angular, esta posee un admin de usuario el cual contiene un select multi-opcion para seleccionar o deseleccionar los foros a los cuales tendra acceso cada usuario registrado en la BD. El backend es por medio de Flask(Python), a lo cual una funcion de angular me trae los registros de la BD. Sin embargo, intente meterle una funcion para darle formato a lo que se trae de la BD antes de insertarlo en la tabla, esta crea un elemento adicional dentro del array llamado optionsForos que es otro array pero solo con los campos de los foros. A continuacion muestro codigo e imagenes para un mejor entendimiento.
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 optionsForos" [value]="dato.val">{{dato.label}}</mat-option>
</mat-select>
</mat-form-field></td>
</ng-container>
TS
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)
// console.log(this.optionsForos)
}
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;
});
}
Lo que hace la funcion de transform como habia comentado es agregar optionsForos
como puedo obtener los valores de ese array optionsForos para que el html del select puede leerlo y me salgan las opcion en el.
console.log(this.dataSource)
es el primer elemento (0
) del primer elemento de una matriz, por lo que quizá quieras decirthis.dataSource[0][0]["optionsForos"]
en vez dethis.dataSource["optionsForos"]
.