时间戳

首页 > 解决方案 > 在 RxJs 6 中避免嵌套的 subcribe() 调用

angular - 在 RxJs 6 中避免嵌套的 subcribe() 调用

问题描述

有时我需要来自以前的 observable 的值并运行另一个依赖于该值的函数，依此类推。它进行嵌套的 subcribe() 调用，然后代码非常丑陋且难以管理。我这里有一个例子：

getObservableData().subcribe(next=>
    let dialogRef=this.dialog.open(EvalListComponent, {data: next})
    dialogRef.afterClosed().subscribe(next=>{
        let k=dialogRef.componentInstance.getAnotherObservableData()
            .subcribe( next=> doSomthing(next))
}))

什么样的解决方案会出现这样的情况。我需要一些扁平的结构。我知道有一个管道函数，可以与 rxjs 运算符一起使用。但是怎么可能实现呢？

标签： angulartypescriptobservablerxjs6

解决方案

我推荐这篇文章：学习扁平化策略。

TLDR：使用地图运算符，例如：mergeMap, switchMap, concatMap, exhaustMap.

它们大多都以相同的方式工作——</p>

  1. 它们将一些值映射到可观察值（您是负责从它们返回可观察值的人，他们只是映射它）

  2. 他们将你返回的 observable 变平（他们只是订阅它）

  3. 他们决定在扁平化之前/之后做什么（“扁平化策略”）

您唯一需要决定的是哪种策略对您的示例有用。通过阅读这篇文章，你可以很容易地弄清楚。

推荐阅读