Question

从今天早上开始，我一直在努力解决一个令人头疼的问题。

我将从解释（非常简单的）情况开始。

我创建了由标题和成员数组组成的组，仅由其id字符串给出。

现在，我要显示这些组。是不是很简单？但是，我当然不希望仅显示成员的ID，而是显示有关组用户的完整信息（例如基本上是其名称...）。

因此，我当然有一项用于获取所有网上论坛的服务，另一项是用于通过其ID来获取用户的服务。

在React中，由于我没有使用rxjs，所以我不会有任何问题；异步/唤醒和Promise.all可以解决问题。

但是，在渲染之前，尝试获取完整的信息（调用2个服务）时会出现一些问题，如下所示： 1.我想得到小组 2.迭代 3.迭代组成员 4.最后为每个成员获取其ID。因此，每个组都可以有一个groupcompleteusers数组，例如，每次从id获取有关用户的信息时，我都会填充该数组...

因此，我尝试了以下操作：
-首先，我尝试使用异步/唤醒，Promises，但是由于我正在调用返回Observable的服务，所以我有点迷路了。
-然后我尝试使用嵌套订阅。但是，我完全无法正确编写它，因为我不仅要在组上迭代，而且还要在group.members上迭代（在嵌套订阅时不存在，因为group当时是一个Observable。 ..）

因此，使用angular 7 / rxjs 6，我尝试了以下操作：

getGroups(){
this.groupsService.getGroups().pipe(
  flatMap(group => 
    {
      for(let member of group.members){
        this.userService.getUser(member);
      }
    }
    )
).subscribe(u => this.groups = u)


}

当然，它不起作用，尤其是当group.member当时不存在时。

所以我有点卡住了。

也许有些线索？

谢谢！

Answer 1

flatMap函数希望您返回一个Observable，因此您可以执行以下操作：

import { forkJoin } from 'rxjs';

getGroups(){
  this.groupsService.getGroups().pipe(
    flatMap((groups: any[]) => {
      let members = groups.map(grp => grp.members)
                          .reduce((res, arr) => res.concat(arr), []);
                          .map(member => this.userService.getUser(member))
      return forkJoin(members);
    })
  )
).subscribe(u => this.groups = u)

在这里，我们在数组上使用map，将其从members数组转换为Observable数组。然后，我们使用forkJoin将Observable的数组连接到单个Observable中，并将其返回到flatMap

嵌套订阅在Angular中，并在第一个结果上进行迭代

1 个答案: