0
293
ViewsDe 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 answers
Answer question0
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
Report
Answer question