当 mat-table 在 NgIf 内时，mat-paginator 会中断

Question

我有一个使用角项目mat-table和mat-paginator对于特定视图，问题是该视图具有网格视图和表格视图与肘节，网格视图是默认和表是使用NgIf时隐时现的网格视图是活动的。如果我将默认设置为表格视图，则分页工作正常，除非我切换到网格视图并返回，如果默认设置为网格，则在我切换到表格视图时会中断。我猜是因为当这段代码运行时表是隐藏的：

this.sliceList = new MatTableDataSource<Slice>(result);
this.sliceList.paginator = this.paginator;

我尝试了控制台日志记录this.sliceList，但sliceList.paginator在默认网格视图时未定义，因此我认为这是问题所在。我怎样才能解决这个问题？

Answer 1

根据此线程，尝试使用 [hidden] 而不是 *ngIf。

<div [hidden]="condition">
  <mat-table [dataSource]="dataSource">
  ...
  </mat-table>
</div>

Answer 2

第一个解决方案

将 mat-paginator 从 *ngIf div 内部移动到外部

第二种解决方案

在声明 MatPaginator 或 MatSort 时使用静态 false

@ViewChild(MatPaginator, {static: false}) paginator: MatPaginator;
@ViewChild(MatSort, {static: false}) sort: MatSort;