Angular 2摆脱了嵌套订阅

时间:2018-06-19 17:32:24

标签: javascript angular

你们中的任何人都可以告诉我如何摆脱下面的代码这样的嵌套订阅吗?我需要从订阅中获取值,以使其更井井有条,但是如果使用全局变量,则它将是未定义的,因为订阅尚未接收到该值。

this.activatedRoute.params.subscribe((params: Params) => {
  if (params) {
    this.room = params['room'];
    this.service.func(o).subscribe(data => {
      if (data) {
        this.localstore = data;
        this.title = 'Current store ' + this.localstore;
        this.service.send(b, {
           data: data
        });
      }
    });
  }
});

2 个答案:

答案 0 :(得分:1)

您可以按照可比性的方式将可观察性与常规的诺言相链接,可以使用flatMap运算符:

this.activatedRoute.params
  .flatMap((params: Params) => {
    if (params) {
      this.room = params['room'];
      return this.service.func(o);
    } else {
      return null;
    }
  })
  .subscribe(data => {
    if (data) {
      this.localstore = data;
      this.title = 'Current store ' + this.localstore;
      this.service.send(b, {
         data: data
      });
    }
  });

这样,每个下一个块将在上一个块之后立即执行。请注意,除了最后一个块之外,每个块都必须使用flatMap。它应该包含常规的subscribe

答案 1 :(得分:0)

您可以在可观察对象上使用".flatMap"函数。它们与Promise“ .then”非常相似。

因此您的代码应如下所示:

this.activatedRoute.params.flatMap((params: Params) => {
  if (params) {
    this.room = params['room'];
    return this.service.func(o);
  }
  return null;
).subscribe(data => {
  if (data) {
    this.localstore = data;
    this.title = 'Current store ' + this.localstore;
    this.service.send(b, {
      data: data
    });
  }
});

平面图使您可以等到可观察对象发送结果。因此,您可以使用平面映射将多个异步请求链接在一起。