在Angular 2 App中使用Observable时出现异步管道错误答案

【问题标题】：Async Pipe Error While Using Observable in Angular 2 App在Angular 2 App中使用Observable时出现异步管道错误
【发布时间】：2017-07-28 07:21:41
【问题描述】：

我在我的 Angular 2 应用程序中进行了分页，但遇到了一个问题，即我收到错误：异步管道：

管道“AsyncPipe”的参数“无效”

在我所做的研究中：这个错误通常与异步管道需要一个可观察的事实有关。这让我很困惑，因为我使用的是可观察的，所以我不确定问题是什么。

首先，这是我的相关视图代码：

<tr *ngFor="let record of records | async | paginate: { id: 'stream', itemsPerPage: 15, currentPage: page, totalItems: total }">

该组件正在使用来自另一个组件的 Input()，如下所示：

@Input() records = [];

这是来自其他组件的“记录”，这是我订阅 OnInit 的可观察对象：

ngOnInit() {
   this.streamService.getBySection('section1')
        .subscribe(resRecordsData => this.records = resRecordsData,
        responseRecordsError => this.errorMsg = responseRecordsError);
}

我在这里缺少什么？我需要在某处明确声明它为可观察类型吗？

【问题讨论】：

大概你的意思是解决可观察的，分页然后迭代结果？在这种情况下let record of (records | async | paginate: { ... })"。但似乎可观察对象已经在您的班级中由.subscribe 解析，并且未作为可观察对象暴露给模板。
这与我已有的有什么不同？
括号阐明了操作的顺序，有时可能会出错。但是您遇到的问题是 records 似乎不是可观察的。

标签： javascript angular asynchronous typescript

【解决方案1】：

异步管道期望的是可观察的，而不是解析的数据。

ngOnInit() {
   this.records = this.streamService.getByStage('section1');
}

【讨论】：

谢谢，所以我想我的想法是，“异步”管道在这种情况下是多余的吗？如果我已经返回了 observable 的结果，则无需使用它。对吗？
没错。如果您没有绑定到 Observable 而是普通对象，则可以删除异步。
好的，有道理。谢谢。