如何避免嵌套订阅超过两个级别

时间:2019-04-17 11:48:21

标签: javascript angular

我有四个彼此依赖的订阅。我知道关于避免嵌套订阅的答案太多。但是没有人回答两个以上的水平。

如何避免许多嵌套订阅

这是我的组件代码

treetree

这是服务代码

MyEdge

有什么办法可以避免这么多的订阅。我无法删除其中的任何一个,因为其中一些来自我们的服务器,而其他则是第三方

1 个答案:

答案 0 :(得分:0)

有一些选择,但是我认为您需要该结构,因为您需要来自上一个可观察到的数据,因此可以使用filter()switchMap()

filter()能够过滤出不包含必要值switchMap()的值-切换到新流。

更新:

您的代码有一个重构版本:

if (!this.code) {
  return;
}

this.appService.updateData('Users/clever_token', {code: this.code}).pipe(
  filter(data => !!data.detail),
  switchMap(data => {
    this.accessToken = data.detail.access_token;

    return this.appService.getCleverData('/v2.1/me', this.accessToken);
  }),
  filter(data1 => !!data1.links),
  switchMap(data1 => {
    this.userData.user_type = data1.type;

    return this.appService.getCleverData(data1.links[1].uri, this.accessToken);
  }),
  filter(data2 => !!data2.data),
  switchMap(data1 => {
    this.userData.name = data2.data.name.first + ' ' + data2.data.name.last;
    this.userData.clever_id = data2.data.id;
    this.userData.email = data2.data.email;

    return this.appService.updateData('Users/cleaver_login', this.userData);
  }),
).subscribe(data3 => {
  if (data3.detail) {
    console.log(data3.detail);
  }
}