我在我的应用程序中使用了Angular Material,我有两个mat-table,对单个组件进行排序,但我的排序仅在第一个表上有效
这是ts代码
@ViewChild(MatSort) inventoryDataSort: MatSort;
@ViewChild(MatPaginator) inventoryDataPaginator: MatPaginator;
@ViewChild(MatSort) additionalDataSort: MatSort;
@ViewChild(MatPaginator) additionalDataPaginator: MatPaginator;
ngAfterViewInit() {
this.inventoryDataSource.sort = this.inventoryDataSort;
this.inventoryDataSource.paginator = this.inventoryDataPaginator;
this.additionalDataSource.sort = this.additionalDataSort;
this.additionalDataSource.paginator = this.additionalDataPaginator;
}
垫表
<mat-table #table1 [dataSource]="inventoryDataSource" matSort> <mat-table #table2 [dataSource]="additionalDataSource" matSort>
解决方法
ViewChild中的选择器查询DOM并找到第一个数学.你能尝试改变这部分吗？
@ViewChild(MatSort) inventoryDataSort: MatSort; @ViewChild(MatPaginator) inventoryDataPaginator: MatPaginator; @ViewChild(MatSort) additionalDataSort: MatSort; @ViewChild(MatPaginator) additionalDataPaginator: MatPaginator;
至
@ViewChild(MatSort) inventoryDataSort: MatSort;
@ViewChild(MatPaginator) inventoryDataPaginator: MatPaginator;
@ViewChild('table2',{read: MatSort}) additionalDataSort: MatSort;
@ViewChild('table2',{read: MatPaginator}) additionalDataPaginator: MatPaginator;
