0

I want to make a list of tables with sorting functions for each table. The thing is that I don't know the quantity of the tables(depends on the length of the list), I've check how to do it with two tables. But when it comes to unknown quantity, how should I do it?

Thanks in advance.

CrazySean007
  • 51
  • 1
  • 4
  • Your description is too confusing. Please provide some concrete examples of what you mean. – Tim Roberts Apr 09 '21 at 21:10
  • https://stackoverflow.com/questions/47271379/multiple-mat-table-with-matsort-within-the-same-component It's similar to this one, but instead of only two tables I want to make it with a list of data sources and make a table with each data source. – CrazySean007 Apr 09 '21 at 21:19

1 Answers1

0

More information about which kind of tables and which data you have is will be useful here. But what I would generally recommend is to create a list of Table objects (this list should be populated somehow automatically because you don't know the number of the tables).

Then I would recommend creating a separate component for <mat-table> that should bind some data from the Table object.

Something like this pseudo code (note: it's just an example, check the syntaxes, etc. Just giving you the idea):

TS

Table1 = {
   name: "Peter",
   age: 25,
   country: "USA:
}

Table2, Table3 (as above)..

this.tables = [Table1, Table2, Table3]

HTML

<div *ngFor = let table of tables>
  <my-table-compopent
      [name]=table.name
      [age]=table.age
      [country]=table.country
  </my-table-component>
</div>

my-table.compopent.html

<mat-table #sBSort matSort style="min-width: 1200px;">
      <ng-container matColumnDef="domain">
        <mat-header-cell *matHeaderCellDef mat-sort-header> {{name}} </mat-header-cell>
        <mat-cell *matCellDef="let row"> {{age}} </mat-cell>
      </ng-container>
</mat-table>
NBash
  • 455
  • 3
  • 10