Question

我的组件中有ngFor：

<li *ngFor="let item of items$ | async">
     {{item}}
    </li>

这是我的组件代码：

this.items$ = Observable.of(true)
    .flatMap((shouldPresentNumbers) => {
      if(shouldPresentNumbers)
         return  Observable.forkJoin(Observable.of(1,2,3,4,5));
    });

我的目标是异步渲染项目。意味着我需要items$才能获得Observable<Array<any>>类型的对象。不幸的是，在运行上面的代码之后，我只获得items$的一个可观察量（最后一个值的可观察值 - > 5）。

如何返回[1,2,3,4,5]的Observable？

Answer 1

好的，让我们讨论一下这个结构：

Observable.forkJoin(Observable.of(1,2,3,4,5))

Observable.of()生成一个Observable，连续发出5个项目。 fork-join等待它完成，然后返回最后一个项目5.你需要的是一个包含5个项目的Observable：

Observable.of([1,2,3,4,5])

因此，您可以通过这种方式简化代码：

this.items$ = Observable.of(true)
    .flatMap((shouldPresentNumbers) => Observable.of(shouldPresentNumbers ? [1,2,3,4,5] : []));

Plunkr

带有ngFor的Angular4异步管道

1 个答案: