Angular 2.0.1 AsyncPipe 不适用于 Rx Subject

Question

AsyncPipe 与 BehaviorSubject 配合使用，但我不想用空数据初始化我的服务，因此我使用 Subject intead。

问题是 NgFor 和 asyncPipe 不适用于 Subject，这是个问题吗？

这个有效:

组件:

export class AppComponent {
  foo = new BehaviorSubject<Array<number>>([1,2,3]);

  getFoo(){
     return this.foo.asObservable();
  }
}

模板

<span *ngFor="let e of foo.asObservable() | async">{{e}}</span>

这行不通:

组件

export class AppComponent {
  foo = new Subject<Array<number>>();

  constructor(){
     setTimeout(() => {
          this.foo.next([1,2,3]);
     }, 3000);
  }

  getFoo(){
     return this.foo.asObservable();
  }
}

模板

<span *ngFor="let e of foo.getFoo() | async">{{e}}</span>

Answer 1

这里的问题是从我的模板调用一个方法 - 这意味着每次运行变化检测时，我都会调用你的 getFoo() 函数，它返回一个新的可观察实例，它会重置异步管道。

因此，无论您在 NgFor 中调用 getFoo()，代码都会失败。

解决方案，在组件中创建一个可观察变量。