带有虚拟滚动条的材质表

Question

有人可以向我提供代码片段以在物料表中使用virtualscrollbar
我尝试了以下示例。

<table #scrollExample mat-table [dataSource]="dataSource" cdkScrollable  class="mat-elevation-z8">
  <ng-container [matColumnDef]="column" *ngFor="let column of displayedColumns; let i=index">    
   <th mat-header-cell *matHeaderCellDef>
     <span class="{{colourIndicators[i]}}"> {{column}}</span>
   </th> 
   <td mat-cell *matCellDef="let element">
    <span>{{element[column]}} </span>
   </td>
 </ng-container>
  <tr mat-header-row *matHeaderRowDef="columnsToDisplay"></tr>
  <tr mat-row *matRowDef="let row; columns: columnsToDisplay;"></tr>
</table>

@ViewChild('scrollExample', { static: false }) scrollExample: CdkScrollable;
constructor(private matScrollDispatcher: ScrollDispatcher) {
  this.matScrollDispatcher.register(this.scrollExample);
  this.matScrollDispatcher.scrolled().subscribe(e => {
    console.log('table scrolled', e);
  });
}

获取AppComponent.html：2错误TypeError：无法读取未定义的属性'elementScrolled'