How to distinguish two mat-table (Angular UI) in same component

Question

I use two mat-table in the same component and now renderRows() not working for the second table.

  @ViewChild(MatTable) tagsTable: any;
  @ViewChild(MatTable) serviceAreaTable:any;

this.tagsTable.renderRows(); #Work fine.

this.serviceAreaTable.renderRows(); #Not Work

Answer 1

You can use template selectors to distinguish your elements

<table mat-table #table1></table>
<table mat-table #table2></table>

and to access them inside your component:

@ViewChild('table1', {static: false}) table1: MatTable;
@ViewChild('table2', {static: false}) table2: MatTable;