Dynamic tables on Angular

61 Views Asked by At

Good evening colleagues,

I am having difficulty with the creation of a dynamic table, Basically I have to create a table that

Has header-cells with many sub-cells. When clicked, the header-cell must expand and show all its internal columns with their respective row values. We are talking about 6 columns that contain 8+ sub-columns inside them.

I am trying with Angular Material, I managed to create it, but it is a fold of non-dynamic code and above all I cannot manage the width of the sub-columns properly. What is more, I have difficulty in matching the object to the columns in cases where the variables have names in different languages.

On bliz there is a bang of the idea I am pursuing, not complete and not working.

This is an example of an idea I was embarking on, then I got lost in errors, columns, rows and stuff.

https://stackblitz.com/edit/angular-bklajw-7xzyex?file=app%2Ftable-basic-example.html

enter image description here

I hope you understand the objective a little. Tomorrow I will study the documentation again, to try to better understand how the angular material table works and how to dynamically manage the table even with complex objects.

If you have suggestions, repos, useful documentation, welcome.

0

There are 0 best solutions below