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

Question

我是Rxjs的初学者，我找不到真正回答我问题的话题。

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

如果我理解得很好，我需要使用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的结果，我有一个错误）。

这就是我目前的回报：

console.log of datas returned

这就是我想要的：

[PokemonObject, PokemonObject, PokemonObject, ...]

如果有人能向我解释如何做到这一点会很棒，谢谢:)

Answer 1

在你的代码中，从concatMap返回的是一个可观察的数组，因为我猜pokemons.results是一个数组，array.map返回一个数组。 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`, []))
  );
}