【问题标题】:How do I combine multiple nested angular flattening operators?如何组合多个嵌套的角度展平运算符?
【发布时间】:2019-09-02 03:01:21
【问题描述】:

我正在尝试从多个函数中使用 Observables 的结果。有些需要按顺序运行,有些则不需要。另外,第一个的结果需要传递给一些嵌套的。

我查看了多个示例。但是,我似乎无法弄清楚这种特殊的组合。语法只是让我感到困惑。

假设您有以下函数,每个函数都返回一个 Observable。

saveContactDetails(): Observable<ContactDetails> {
    // Returns single observable with single ContactDetails.
}

savePhones(contactId: string): Observable<Phone[]> {
    // Returns single observable with array of Phones.
}

saveEmails(contactId: string): Observable<Email[]> {
    // Returns single observable with array of Emails.
}

saveAll(): Observable<Contact> {
    // TODO: Can't figure out the login/syntax here.
}

步骤:

  1. 调用 saveContactDetails()。只有在这完成后,才能继续。
  2. 使用 saveContactDetails() 的结果,调用 savePhones() 和 saveEmails()。这两个函数(可能还有更多函数)可以不按特定顺序并行运行。
  3. 所有“子”Observable 完成后,将所有(父级和子级)的结果合并到一个 Observable 中以从 saveAll() 返回。

我假设我需要使用concatMapmergeMap(或者可能是forkJoin)。但同样,我似乎无法使用在线文档和示例弄清楚语法。

【问题讨论】:

  • 所有这些都必须是可观察的有什么原因吗?其中一些是否可以改为承诺?
  • @chrismclarke 每个函数都使用 http.post 进行单独的 API 调用。然后映射。所以,在某个地方,我需要处理这些人的反应。我很容易返回 http.post(stuff).map(stuff)。
  • 您可以使用 .toObservable() 将这些 http 帖子转换为 observables。然后,您可以使用 async/await 更轻松地管理等待操作完成。在我看来,这比处理大量订阅和合并要简单得多

标签: angular typescript rxjs


【解决方案1】:

看起来像这样。

您将 switchMap 转换为需要从第一个输入的那些的 forkJoin。然后您使用内部地图来组合所有 3 的结果。

  saveAll(): Observable<Contact> {
    return this.saveContactDetails().pipe(
      switchMap(contactDetails => forkJoin([
          this.savePhones(contactDetails.id), // however you get the id
          this.saveEmails(contactDetails.id)
        ]).pipe(
          map(([phones, emails]) => 
            Object.assign(contactDetails, {phones, emails})) // whatever your transform is
        )
      )
    );
  }

【讨论】:

  • 这里 switchMap() 的目的是什么?根据我的理解,这意味着停止一切。并开始下一个任务。我强迫什么停止?
  • switchMap 在新的外部发射时取消之前的内部订阅,因此只有一个内部订阅处于活动状态。在这种情况下,由于一切都是单次发射,因此不会发生取消,因为只有一次发射。 switchMap、mergeMap 和 concatMap 在单次发射情况下的功能完全相同。但是,从语义上讲,我更喜欢 switchMap,因为它表明永远只有一个活动的内部订阅。
猜你喜欢
  • 2021-12-12
  • 1970-01-01
  • 2018-10-07
  • 2017-09-20
  • 2012-11-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多