Angular 数据表，dataStream.pipe 不是函数答案

【问题标题】：Angular Data table, dataStream.pipe is not a functionAngular 数据表，dataStream.pipe 不是函数
【发布时间】：2018-05-22 00:13:52
【问题描述】：

我正在尝试使用角度数据表创建一个表，但我收到了这个错误，我认为该错误来自数据源，但我不知道如何解决它。任何建议表示赞赏。

这是我得到的错误：

dataStream.pipe 不是函数

这是表格的html：

    <div class="example-container mat-elevation-z8">
      <mat-table #table [dataSource]="dataSource">
        <!--*- Note that these columns can be defined in any order.
        The actual rendered columns are set as a property on the row definition" -->
        <!--* Idr Column -->
        <ng-container matColumnDef="idr">
          <mat-header-cell *matHeaderCellDef> Idr </mat-header-cell>
          <mat-cell *matCellDef="let receipts"> {{receipts.idr}} </mat-cell>
        </ng-container>
        <!--* Period Start Column -->
        <ng-container matColumnDef="fromDate">
          <mat-header-cell *matHeaderCellDef> Periode start </mat-header-cell>
          <mat-cell *matCellDef="let receipts"> {{receipts.fromDate}} </mat-cell>
        </ng-container>
<mat-header-row *matHeaderRowDef="displayedColumnsReceipt"></mat-header-row>
        <mat-row *matRowDef="let row; columns: displayedColumnsReceipt;"></mat-row>
      </mat-table>
    </div>

这是数据源类：

export class ReceiptDataSource extends DataSource<any> {  

constructor(private registerService: RegisterService) {
    super();
  }

  connect(): Observable<IReceipt[]> {
    return this.registerService.getReceipt();
  }

  disconnect() {}

}

这是我的组件中定义数据源和表结构的部分：

dataSource = new ReceiptDataSource(this.registerService);
displayedColumnsReceipt = ['idr', 'fromDate'];

这是声明 getReceipt 方法的服务：

getReceipt(): Observable<IReceipt[]> {
console.log('sdrParsed: ', this.sdrParsed.receipts);
return this.sdrParsed.receipts;
}

【问题讨论】：

标签： json angular material-design

【解决方案1】：

很难从提供的代码示例中确定，但鉴于错误是说 .pipe 不是函数，这几乎可以肯定意味着从您的连接方法返回的不是 Observable。您可以尝试一些代码，看看您是否可以订阅您的服务功能的返回，以确认订阅也失败。如果它不是一个 Observable，你可以确保返回一个有效的 Observable 对象。

【讨论】：