时间戳

首页 > 解决方案 > Angular - 多个订阅序列不起作用

angular - Angular - 多个订阅序列不起作用

问题描述

在角度我想创建一个多订阅序列。当第一次订阅完成后，再进行下一次订阅。与此类似。 

this.globalCtrl.getSon().subscribe(
                  response => {
                    this.son= response;
                  },
                  error => {
                    console.log(error);
                  },
                  () => {
                   //DOESN´T ENTER IN THIS SUBSCRIBE
                    this.dashboardCtrl.getMarkers(this.son).subscribe(

                      response => {
                        this.markers = response["body"]["data"];
                        if (this.markers.length == 0) {
                          this.toast.fire({
                            type: "error",
                            title: "No hay datos geográficos del grupo seleccionado"
                          });
                        }
                        this.timezone = response["body"]["timezone"];
                      },
                      error => {
                        console.log(error);
                      }
                    );

问题：没有进入第二个订阅并且“响应”有数据。¿ 有人知道我该怎么做吗？

更新

如果我将第二个订阅放在这样的响应中

  this.globalCtrl.getSon().subscribe(
                      response => {
                        this.son= response;
                        this.dashboardCtrl.getMarkers(this.son).subscribe(

                          response => {
                            this.markers = response["body"]["data"];
                            if (this.markers.length == 0) {
                              this.toast.fire({
                                type: "error",
                                title: "No hay datos geográficos del grupo seleccionado"
                              });
                            }
                            this.timezone = response["body"]["timezone"];
                          },
                          error => {
                            console.log(error);
                          }
                        );

有效，但视图不显示数据。当我正确刷新视图数据加载时，但在第一次加载时不加载数据。

更新 2：使用开关图

  this.globalCtrl.getfather().pipe(
      switchMap(son=> this.dashboardCtrl.getMarkers(son.toString()).subscribe( /ERROR
        response => {
          this.markers = response["body"]["data"];
          if (this.markers.length == 0) {
            this.toast.fire({
              type: "error",
              title: "No hay datos geográficos del grupo seleccionado"
            });
          }
          this.timezone = response["body"]["timezone"];
        },
        error => {
          console.log(error);
        }
      )
    );

OperatorFunction 中不存在属性订阅

也许可观察的导致错误

 getFather(): Observable<any> {
    return this.grupo.asObservable();
  }

标签： angularrxjs

解决方案

建议您不要将订阅嵌套在另一个订阅中。它使管理变得困难，并且几乎不可能正确取消订阅。相反，使用switchMap.

这是我的一个示例应用程序的示例：

  todosForUser$ = this.http.get<User>(`${this.userUrl}/${this.userName}`)
    .pipe(
      switchMap(user =>
        this.http.get<ToDo[]>(`${this.todoUrl}?userId=${user.id}`)
      )
    );

你可以在这里看到这段代码：

https://stackblitz.com/edit/angular-todos-deborahk

使用您的代码，它将是这样的（未检查语法）：

import { switchMap } from 'rxjs/operators';

this.globalCtrl.getSon()
 .pipe(
    switchMap(son => this.dashboardCtrl.getMarkers(son))
 ).subscribe(...);

更新：简化的初始示例，最初演示了如何处理多个相关数据集。

推荐阅读