如何更新异步管道中使用的 Observable？答案

【问题标题】：How can I update Observable, which used in async pipe?如何更新异步管道中使用的 Observable？
【发布时间】：2018-01-23 04:26:17
【问题描述】：

问题是：我有一个简单的组件，它呈现一些消息的“历史”。当应用程序加载时，它会发出 POST 请求，获取数据并将数据设置为 Observable，就像这样

this.messages$ = Observable.of(messagesAfterPOSTRequest);

在哪里public messages$: Observable<any>;

此数据通过异步管道在模板中呈现：

let message of messages$ | async

效果很好，但是....

我通过 websocket 收到一些“新消息”，所以我想更新在上一步创建的列表。我正在尝试使用scan()

this.messages$ = this.messages$.scan((accMessage, numMessage) => {
        console.log("inside current mesages", accMessage, numMessage)
      });

为了“更新”当前列表消息，但是这个 console.logs 看起来永远不会工作，即使使用 subscribe()

【问题讨论】：

【解决方案1】：

使用Subject 的实例并将消息推送到其中：

const subject$ = new Subject();

...

subject.next(messagesAfterPOSTRequest);

...然后使用 async 管道以相同的方式将其用作模板。

如果您也希望能够获得以前的消息，也许还可以查看 ReplaySubject 或 BehaviorSubject 类。

【讨论】：

问题是在开始我有消息列表，它的作品 subject.next(messagesAfterPOSTRequest);但是当我只收到一条消息时 - 我从一条消息中获取列表，在 next() 之后删除历史记录
然后使用.scan 运算符并将消息添加到数组中：.scan((acc, val) => { acc.push(val); return val;}, [])