Angular 2 + rxjs:与.share()运算符的异步管道

hig*_*ile 10 rxjs angular

当在使用.share()运算符的observable上使用异步管道时(由于后端的昂贵计算),我偶然发现了这种行为:

data$ = (new Observable(observer => {
    let counter=0;
    observer.next(counter)

    window.setInterval(() => {
      observer.next(counter);
      counter++;
    }, 2000);
  }))
  .share();
Run Code Online (Sandbox Code Playgroud)

模板:

{{ (data$|async) !== null }}
{{ (data$|async) !== null }}
Run Code Online (Sandbox Code Playgroud)

初始值的输出是:

true false
Run Code Online (Sandbox Code Playgroud)

以下输出(超过2秒后)是:

true true
Run Code Online (Sandbox Code Playgroud)

这也是我对第一个值所期望的行为.如果省略.share(),则第一个值的输出为"true true",正如我所料.我想上面的行为是由于模板中的第一个表达式触发了可观察的执行,并且一旦第二个异步管道订阅了observable,数据就已经消失了.这个解释是否正确?我怎样才能避免这种行为?

Est*_*ask 15

根据参考,

异步管道订阅Observable或Promise并返回它发出的最新值.

在RxJS 4中,shareReplay用于实现所需的行为.

在RxJS 5,直接对应shareReplaypublishReplay,随后refCount(参见解释讨论).

所以它应该是

data$ = (new Observable(observer => { ... }))
.publishReplay(1)
.refCount();
Run Code Online (Sandbox Code Playgroud)