Question

我有一个ngOnInit（）方法，该方法在开始时会填充数据列表，我根据存在查询参数（导航回页面）或只是第一次打开页面而做出两种不同的逻辑。但是在这两种逻辑上我有一个很奇怪的错误。

在以下代码中：

  ngOnInit() {
    this.route.queryParams.subscribe((queryParams: Params) => {
      this.initFilters(queryParams);
      if(this.group) {
        this.getActiveGroups();
        //console.log(this.activeGroupList);
      }
    });
    this.getActiveGroups();
  }

getActiveGroups(): void {
    this.service123.getActiveGroups().subscribe((groupData: Group[]) => {
      this.activeGroupList = groupData;
      //console.log(this.activeGroupList);
    })
  }

第二条注释（console.log行）运行良好，并记录了来自后端的列表数据。但是第一个注释给出了错误，并说该变量未定义。它们是相同的变量，但是为什么第一个未定义？我也需要在第一个注释部分中使用该列表，因此可以在函数中使用它。还是应该定义该变量，例如static？

我该如何实现？

Answer 1

在ngOnInit中，您要使用activeGroupList变量，然后再获取任何值，因为getActiveGroups()方法执行了async操作。您可以使用switchMap中的RxJS来组合异步调用，以得到如下结果：

ngOnInit() {
    this.route.queryParams.pipe(
      tap((queryParams: Params) => {
          this.initFilters(queryParams);
      }),
      swicthMap(() => {
          return this.service123.getActiveGroups()
      })
    )
    .subscribe((groupData: Group[]) => {
      this.activeGroupList = groupData;
      //console.log(this.activeGroupList);
    })
}

查看本文，以进一步了解RxJS映射运算符：https://netbasal.com/understanding-mergemap-and-switchmap-in-rxjs-13cf9c57c885

如何解决Typescript范围内的未定义数据？

1 个答案: