網站搜尋

typescript - Angular6-Angular Mat-pagintor 無法正常運作


我正在使用 Angular 6,我這個檔案的輸入是 cpDataSource,它包含 1000 個元素,有人能幫我理解為什麼它不起作用嗎,提前感謝。

HTML

<div class=" col-xs-12 col-sm-12 col-md-12" *ngIf="cpDataSource">
  <table mat-table [dataSource]="cpDataSource"  multiTemplateDataRows class="mat-elevation-z2" cellspacing="40">
  <ng-container matColumnDef="Lastname">
      <th mat-header-cell *matHeaderCellDef>
        <b>Last Name</b>
      </th>
      <td mat-cell *matCellDef="let element">
        <tr>{{element.lastName}} </tr>
      </td>
    </ng-container>
  </table>
  <mat-paginator #MatPaginator [pageSizeOptions]="[10, 20]" [pageSize]="10" showFirstLastButtons></mat-paginator>
</div>



.TS
export class TableSearchComponent implements OnInit, AfterViewInit {

  
  @Input()
  cpDataSource: ApplicationSearchResult[];
  @ViewChild(MatPaginator) paginator: MatPaginator;
   dataSource :MatTableDataSource<any>;
    ngOnInit() {
 }
  ngAfterViewInit(){
    this.dataSource = new MatTableDataSource(this.cpDataSource);
    this.dataSource.paginator = this.paginator;
  }
  }