'Is it possible to create tables within Angular ts files?

So I have an array which holds different categories to compare different companies. Depending on the user selection there may be 3 categories or 10 to display. I am looking for a dynamic way to insert tables on demand depending on how many categories are selected. Is there a library in Angular or around somewhere which can help with this task ?

I would rather not create 30 tables based off of categories and just hide the unwanted ones.

Thank you.



Solution 1:[1]

I'd use a grid and dynamically set the columns based on user selection as per your requirement.

I usually use ag-Grid library which is a fantastic easy to use library. The free version should suffice for your requirment. Have a look here, https://blog.ag-grid.com/binding-and-updating-column-definitions-in-ag-grid/

Solution 2:[2]

I figured a work around for my issue. I have all the categories in an Array, then I iterate through the array via *ngFor which will load a component

<div *ngFor="let category of Categories">
    <app-display-table-component></app-display-table-component>
</div>

for every category. Inside each component I will show the data regarding the category name.

Thanks for the help guys.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 R.christie
Solution 2 T-Bone