Angular6 matSort和MatPaginator不起作用。为什么？

Question

我跟踪了角形材料站点，并使用API​​的数据创建了数据表。我使用服务连接API和接口。现在它可以工作，但是MatSort和MatPaginator不起作用。您能在我的代码中找到错误吗？有什么建议么？ 表格HTML

 <div class="container">
  <div class="loading-shade"
    *ngIf="isLoadingResults">
  <mat-spinner *ngIf="isLoadingResults"></mat-spinner>

 </div>

 <div class="table-container">
   <mat-form-field  color="accent">
     <input matInput (keyup)="applyFilter($event.target.value)" 
    placeholder="Filter">
   </mat-form-field>

   <table mat-table [dataSource]="dataSource" class="example-table"
        matSort matSortActive="itemId" matSortDirection="asc" 
        matSortDisableClear>

    <!-- itemId Column -->
      <ng-container matColumnDef="itemId">
       <th mat-header-cell *matHeaderCellDef mat-sort-header 
        <td mat-cell *matCellDef="let row">{{row.itemId}}</td>
      </ng-container>

      <!-- Name Column -->
      <ng-container matColumnDef="name">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
       <td mat-cell *matCellDef="let row">{{row.name}}</td>
       </ng-container>

      <!-- Description Column -->
      <ng-container matColumnDef="description">
       <th mat-header-cell *matHeaderCellDef mat-sort- 
          header>Description</th>
         <td mat-cell *matCellDef="let row">{{row.description}}</td>
      </ng-container>

      <!-- Price Column -->
      <ng-container matColumnDef="price">
       <th mat-header-cell *matHeaderCellDef mat-sort-header>Price</th>
       <td mat-cell *matCellDef="let row">{{row.price}}</td>
       </ng-container>

      <!-- inStock Column -->
     <ng-container matColumnDef="inStock">
        <th mat-header-cell *matHeaderCellDef mat-sort-header>Stock</th>
        <td mat-cell *matCellDef="let row" [ngStyle]="{ 'color': 
         (row.inStock ? 'green' : 'red') }">
      <mat-icon>{{row.inStock ? 'check' : 'error'}}</mat-icon>
       </td>
     </ng-container>

      <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
      <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
     </table>
     </div>

      <mat-paginator class="  mat-elevation-z8" [length]="resultsLength" 
        showFirstLastButtons></mat-paginator>
       </div>

TS文件 component.ts