Rxjs 6 - 为每个结果获取一个数组并将对象推送到数组

Question

我是 Rxjs 的初学者，我没有找到真正回答我问题的主题。

基本上，我想要一个 Observable，其中 return 一组 Pokemons 及其信息。为此，我首先需要发出请求以获取 Pokemon 名称的数组。然后，我想在这个数组中循环以获取有关宠物小精灵的所有信息，将其放入一个数组中，然后 return 这个数组。

如果我理解得很好，我需要为此使用 concatMap 运算符，所以我这样做了：

getPokemons(): Observable<Pokemon[]> {
const url = `${this.pokemonsUrl}pokemon/?limit=5`;

return this.http
  .get<Pokemon[]>(url, httpOptions)
  .pipe(
    concatMap(pokemons => {
      const listpokemons = pokemons.results.map(pokemon => {
        return this.getPokemon(pokemon.name);
      });
      return listpokemons;
    }),
    tap(_ => this.log(`Fetched Pokemons !`)),
    catchError(this.handleError(`getPokemons`, []))
  );
}

getPokemon(name: string): Observable<Pokemon> {
 const url = `${this.pokemonsUrl}pokemon/${name}`;

 return this.http.get<Pokemon>(url).pipe (
  tap(_ => this.log(`Fetched Pokemon name=${name} !`)),
  catchError(this.handleError<Pokemon>(`getPokemon name=${name}`))
 );
}

使用这段代码，当我订阅我的 Observable 时，我正在获取 getPokemon 的可观察对象而不是 Observable 的答案，而不是在数组中（因为如果我尝试将 getPokemon 的结果推送到数组中，我有一个错误）。

这是我目前的 return:

console.log of datas returned

这就是我想要的:

[PokemonObject, PokemonObject, PokemonObject, ...]

如果有人能向我解释如何做到这一点，那就太好了，谢谢:)

Answer 1

在你的代码中，concatMap 中的 return 是一个可观察数组，因为我猜 pokemons.results 是一个数组，而 array.map return 是一个数组大批。 concatMap 无法处理数组，它只运行 Observable<any>，如果序列不是问题，您可以尝试 concat 或 forkJoin

return this.http
  .get<Pokemon[]>(url, httpOptions)
  .pipe(
    mergeMap(pokemons => {
      const listpokemons = pokemons.results.map(pokemon => {
        return this.getPokemon(pokemon.name);
      });
      return concat(listpokemons);
    }),
    tap(_ => this.log(`Fetched Pokemons !`)),
    catchError(this.handleError(`getPokemons`, []))
  );
}

Rxjs 6 - 为每个结果获取一个数组并将对象推送到数组

Rxjs 6 - Fetch an array and push object to array for each result

arrays

loops

fetch

subscribe

rxjs