如何在我的管道中正确实施 forkJoin

Question

我有下一根烟斗：

this.adminService.companies$
      .pipe(
        takeUntil(this.unsubscriber),
        map((data: CompanyCard[]) => {
          const companies: CompanyCard[] = [...data.map(company => ({...company}))]

          companies.forEach((company: CompanyCard) => {
            if ('_seconds' in company.created) {
              company.created = new Date(company.created._seconds * 1000)
            }

            if (company.owner) {
              this.userService.getUser(company.owner).pipe(
                take(1),
                takeUntil(this.unsubscriber),
                map((data: User) => data.email)
              ).subscribe(email => company.owner = email)
            }
          })

          return companies;
        }),
        tap(companies => this.companies = companies)
      ).subscribe();

我的问题是当我在模板中呈现此数据时，我看到了闪烁的内容，因为我在 map() 内的所有转换完成之前就获取了数据。所以我想我必须将所有运算符都包装在 forkJoin 中，但我不知道如何正确地做到这一点。

Answer 1

像这样：

this.adminService.companies$
  .pipe(
    takeUntil(this.unsubscriber),
    map((data: CompanyCard[]) => data.map(company => '_seconds' in company.created
      ? ({ ...company, created: new Date(company.created._seconds * 1000) })
      : company
    )),
    switchMap((data: CompanyCard[]) => forkJoin(data.map(company => company.owner
      ? this.userService.getUser(company.owner).pipe(
        take(1),
        takeUntil(this.unsubscriber),
        map((user: User) => ({ ...company, owner: user.email }))
      )
      : of(company)
    )))
  )
  .subscribe(companies => {
    this.companies = companies;
  });

如何在我的管道中正确实施 forkJoin

How to correctly implement forkJoin in my pipe

rxjs

rxjs-pipeable-operators