Как вызывать два API-интерфейса последовательно и возвращать данные из обоих в виде единой наблюдаемой

Question

У меня есть два API для последовательного вызова с данными, возвращенными из первого, используемого во втором.

Я пытался использовать concatMap внутри первого вызова, а затем использовать возвращаемые значенияво втором вызове, но когда я подписываюсь на наблюдаемую, я получаю только данные второго вызова.

Как я могу получить данные обоих вызовов в одной наблюдаемой?

this.dataService.getPlayerData("heunetik").pipe(
    concatMap(data => this.dataService.getLifetimeStats(data.payload.guid))
).subscribe(finalData => {
    console.log(finalData);
});

Читая документацию, это то, что казалось наиболее логичным, но примеры довольно запутанные ...: /

Answer 1

вы хотите сделать какую-то внутреннюю карту для объединения данных:

this.dataService.getPlayerData("heunetik").pipe(
    switchMap(data => this.dataService.getLifetimeStats(data.payload.guid)
                          .pipe(map(innerData => [data, innerData])))
).subscribe(finalData => {
    console.log(finalData);
});

Это вернет данные в массиве, первый набор данных будет равен 0, а второй - 1.

switchMap - это мое предпочтение, здесь не имеет значения между switch / concat / merge ... Все они имеют несколько различное использование, которое имеет значение с несколькими выбросами, но все они будут функционировать здесь одинаково, так как все они - одно излучение. наблюдаемые. Я предпочитаю переход, потому что я думаю, что семантически более ясно, что я ожидаю единичные выбросы, но мнения могут отличаться по этому вопросу.

Карты высокого порядка, используемые для предоставления второго аргумента, который допускал эту комбинацию, но они удалили ее с помощью rxjs 5 или 6 или около того в пользу шаблона внутренней карты, чтобы сэкономить на размере импорта (что для ИМО было плохим решением). Аргументы карты были полезны чаще всего, и внутренняя карта выглядит загроможденной).

Answer 2

мы используем mergeMap, также известный как flatMap, для отображения / итерации по наблюдаемым значениям.

this.dataService.getPlayerData("heunetik").pipe(
    mergeMap(data => this.dataService.getLifetimeStats(data.payload.guid))
    .pipe(map(data2=>([data,data2])
).subscribe(finalData => {
    console.log(finalData);
});