Rxjs 6 - извлекать массив и помещать объект в массив для каждого результата

Question

Я новичок в Rxjs, и я не нашел темы, которая действительно отвечала бы на мой вопрос.

По сути, я хочу иметь Observable, который возвращает массив покемонов с их информацией.Для этого мне нужно, прежде всего, сделать запрос, чтобы получить массив имен покемонов.Затем я хочу выполнить цикл в этом массиве, чтобы получить всю информацию о покемоне, поместить его в массив и вернуть этот массив.

Если я правильно понял, мне нужно для этого использовать оператор 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 возвращенных данных

И это то, что я хотел бы:

[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`, []))
  );
}