0
291
VistasDe JSON anidado a tabla con rango de filas Angular
Traté de hacer una tabla con mi JSON anidado obtenido de una API. No sé cómo fusionar dinámicamente mis celdas cuando sea necesario sabiendo que mi JSON se puede anidar hasta 6 o 7 veces.
Lo que quiero :
mesa que quiero
Lo que obtuve :
mesa que tengo
Mi archivo TS:
questionnaire = [ { title : "theme1", children : [{ title : "theme2", children : [ { title : "theme3", children : [] }, { title : "theme4", children : [] }, ] }] }, { title : "theme5", children : [ { title : "theme6", children : [] }, { title : "theme7", children : [] }, ] }, ]Mi componente.html:
<ng-container *ngFor="let periode of questionnaire"> <br> <table> <tr> <td>{{ periode.title }}</td> <td *ngFor="let theme of periode.children"> {{ theme.title }} </td> </tr> </table> </ng-container>
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
Generar sus tablas a través de una función recursiva y luego configurar el HTML resultante a través de [innerHTML] sería una buena decisión.
La función recursiva necesitaría no solo devolver su parte HTML correspondiente de la tabla, sino también cuántas filas contiene. De esa manera, puede utilizar el atributo de rowspan de fila siempre que haya niños.
·
Juan Pablo Isaza
Denunciar
Responde la pregunta