RxJs的switchMap操作符

Angular应用中常见的一个错误是用以下方式嵌套可观察订阅:

             
             

              observable1.subscribe (数据= >{observable2.subscribe (otherData= >｛//对otherData执行一些操作});})；
             
代码语言:JavaScript（javascript）

不推荐使用上述语法，因为它很难阅读，并且可能导致微妙的错误和意想不到的副作用。例如，这种语法很难正确地取消所有这些可观察对象的订阅。

同样,如果observable1如果在短时间内触发多次，则可能需要取消以前的订阅observable2并根据接收到的新数据开始一个新的observable1．上面的代码没有做任何这些工作。

解决方案:使用RxJsswitchMap这样的运算符:

             

              observable1.pipe (数据= >{switchMap (数据= >observable2) .subscribe (otherData= >｛//对otherData执行一些操作});
             
代码语言:JavaScript（javascript）

的switchMapOperator执行以下所有操作:

• 自动取消和取消订阅observable2如果observable1产生一个新值。
• 自动取消订阅observable2如果我们取消订阅observable1
• 确保observable1而且observable2依次发生，一个接一个。

下面的大理石图很好地说明了什么switchMap:

如果你不吸毒的话switchMap但是，请在代码中查找对的嵌套调用.subscribe ()，然后开始用switchMap操作符，以防止内存泄漏和错误，并使您的代码更具可读性。

这里有一个链接一个使用定时器每30秒发出一次HTTP请求的例子获取更新的数据。使用将计时器数据转换为API调用switchMap在示例的第37行。