mat-paginator breaks when mat-table is inside of NgIf

This solve my problem in ANgular 10

Setting static to False does the trick.

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

    ngAfterViewInit() {
        setTimeout(() => {
          this.matTableConfig.dataSource = new MatTableDataSource(this.matTableConfig.dataSource);
          this.matTableConfig.dataSource.paginator = this.paginator;
          this.matTableConfig.dataSource.sort = this.sort;
      });

according to this thread,try use [hidden] instead of *ngIf.

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

1st Solution

Move mat-paginator from inside *ngIf div to outside

2nd Solution

use static false while declaring MatPaginator or MatSort

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