错误TypeError：您在期望流的位置提供了“ undefined”。您可以在Angular 8中提供Observable，Promise，Array或Iterable

Question

我正在使用mat排序对角度为8的mat-table进行排序。在使用以下代码时，出现错误“您在预期流中提供了'undefined'”。

ngAfterViewInit() { this.dataSource.sort = this.sort }

请在下面找到完整的源代码：

html文件

        <ng-container *ngFor="let column of columns" [cdkColumnDef]="column.columnDef">
            <mat-header-cell *cdkHeaderCellDef mat-sort-header>{{ column.header }}</mat-header-cell>
            <mat-cell *cdkCellDef="let row"><span class="mobile-label">{{ column.header }}:
                </span>{{ column.cell(row) }}</mat-cell>
        </ng-container>

        <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
        <mat-row *matRowDef="let row; let even = even; columns: displayedColumns;" [ngClass]="{lighterGray: even}">
        </mat-row>

    </mat-table>

TS文件

import { Component, OnInit, Inject, ViewChild, ViewChildren } from '@angular/core';
import { MAT_DIALOG_DATA, MatTableDataSource, MatSort } from '@angular/material';

@Component({
  selector: 'app-past-transaction-table',
  templateUrl: './past-transaction-table.component.html',
  styleUrls: ['./past-transaction-table.component.css']
})
export class PastTransactionTableComponent implements OnInit {
  @ViewChildren(MatSort) sort: MatSort;
  transactionData;
  transactionList = [];
  transactionresponse;
  dataSource;
  isMobile: boolean;

  columns = [
    { columnDef: 'block', header: 'Block', cell: (element: any) => `${element.block}` },
    { columnDef: 'street', header: 'Street Name', cell: (element: any) => `${element.street}` },
    { columnDef: 'range', header: 'Storey', cell: (element: any) => `${element.range}` },
    { columnDef: 'floorArea' + 'model', header: 'Floor Area (sqm)' + " / " + 'Flat Model', cell: (element: any) => `${element.floorArea}` + " " + `${element.model}` },
    { columnDef: 'leaseComm', header: 'Lease Commence Date', cell: (element: any) => `${element.leaseComm}` },
    { columnDef: 'leaseTenure' + 'leaseTenureMonth', header: 'Remaining Lease', cell: (element: any) => `${element.leaseTenure}` + " years " + `${element.leaseTenureMonth}` + " months" },
    { columnDef: 'resalePrice', header: 'Resale Price', cell: (element: any) => "$" + `${element.resalePrice}` },
    { columnDef: 'registrationDate', header: 'Resale Registration Date', cell: (element: any) => `${element.registrationDate}` },
  ];

  displayedColumns = this.columns.map(c => c.columnDef);

  constructor(@Inject(MAT_DIALOG_DATA) data) {
    this.transactionData = data.transactions;
  }

  ngOnInit() {
    this.dataSource = new MatTableDataSource(this.transactionData);
    // setTimeout(() => this.dataSource.sort = this.sort);
    console.log(this.transactionData);
  }

  ngAfterViewInit() { this.dataSource.sort = this.sort }
}

有人可以帮我吗？