Преобразование результата API для сбора дополнительных данных из дополнительных запросов API

Question

У меня есть вызов API, который возвращает список результатов в виде Observable<any[]>.В конечном счете, я хочу показать эти данные в списке, но список должен содержать другие данные для каждой записи, которая не сопровождается этим первым запросом.

Я думаю, что это довольно простое простое описание проблемы.: Дать наблюдаемую часть массива, я хотел бы преобразовать каждый элемент в массиве, вызвав веб-сервис, а затем вернуть измененную наблюдаемую часть массива.

getActivePosts = (): Observable<Post[]> => {
  return this.get('/Post/Active')
    .pipe(
      map(posts => posts.map(u => ({
        title: u.title,
        author: u.author,
        rating: 0      // <- This is the value I have to look up elsewhere
       })))
    );
}

Так что приведенное выше даст мне массивсообщений, но со всеми значениями rating будет 0.

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

getActivePosts = (): Observable<Post[]> => {
  return this.get('/Post/Active')
    .pipe(
      map(posts => posts.map(u => ({
        title: u.title,
        author: u.author,
        rating: 0      // <- This is the value I have to look up elsewhere
       }))),
    switchMap(posts => from(posts)),
    tap(post => console.log('Do something with this individual item...', post)),
    toArray()
    );
}

Еще до того, как я выяснил (возможно) более сложную часть вызова следующего API для получения рейтингов (в настоящее время это просто tap, чтобы показатьконсольное сообщение) я уже застрял.Этот пример никогда не проходит мимо toArray, потому что внутренний поток (созданный from) никогда не завершается.Когда этот код выполняется и подписка на результат этой функции (внешняя наблюдаемая?) Ничего не генерируется.Я могу подтвердить, что начальный вызов API сделан, и devtools показывает, что ответ является массивом, как и ожидалось.

Как мне сделать что-то для каждого элемента в массиве и при этом вернуть массив?Я хотел бы решить этот «путь rxjs», если есть такая вещь.

Answer 1

Ваши случаи использования довольно распространены в наши дни.Вы можете использовать следующий код -

getActivePosts = (): Observable<Post[]> => {
  return this.get('/Post/Active')
    .pipe(
      map(posts => posts.map(u => ({
        title: u.title,
        author: u.author,
        rating: 0      // <- This is the value I have to look up elsewhere
       }))),
      mergeMap(post => this.getRating(post[id]) //check the id
               .pipe(
                  tap(rating => post.rating = rating;
               )
       ),
    toArray()
    );
}