Question

我有两个函数返回Observables。

this.markets$ = this.marketList();
this.buyersReviews$ = this.recentBuyersReviews();

在我的html中，我将这两个与async管道一起使用，如下所示-

<div *ngIf="markets$ | async as market; else loadingOrErrorMarket">
.....
</div>

<section *ngIf="buyersReviews$ | async as review; else loadingOrErrorBuyersReviews">
....
</section>

this.recentBuyersReviews()完全加载后，有什么方法可以调用this.markets$，并将其绑定到this.buyersReviews$并在async管道中使用它吗？ / p>

Answer 1

尝试这样

<ng-container *ngIf="markets$ | async as market; else loadingOrErrorMarket">
        <div>
           .....
        </div>

        <section *ngIf="buyersReviews$ | async as review; else loadingOrErrorBuyersReviews">
                ....
        </section>
</ng-container>

demo ??

Answer 2

尝试类似的方法，其余的保持不变-

this.buyersReviews$ = this.markets$.pipe(
    mergeMap(foo => this.recentBuyersReviews())
);

Answer 3

您可以将它们变成单个流：

  data$ = forkJoin({
    market: this.markets$, 
    buyers: this.buyers$
  })

<div *ngIf="data$ | async as data></div>

快速堆叠演示如何使用： https://stackblitz.com/edit/angular-h8phnz

用异步管道一个接一个地执行Observable

3 个答案: