Несколько наблюдаемых внутри наблюдаемых в Angular / NGRX и объединение результатов в конце - PullRequest
Новая
       9

Несколько наблюдаемых внутри наблюдаемых в Angular / NGRX и объединение результатов в конце

0 голосов
/ 14 ноября 2018

Я использую NGRX с угловым 6. В моем компоненте я вызываю селектор, который возвращает список объектов. Например, 

 list$: Observable<any>;
this.list$ = this.store$.select(getPreviousById(Id));

В настоящее время я связываю возвращенный список с моимHTML, используя | async, и он работает хорошо.У меня есть новое требование, когда некоторые элементы в списке являются ключами, которые мне нужно сделать еще один вызов API, чтобы получить полную информацию для каждого из них.Я не уверен, как это сделать, и все еще сохраняю привязку к HTML.

Нужно ли обрабатывать исходную возвращаемую наблюдаемую и затем извлекать эти ключи, отправлять действие в хранилище и объединятьрезультаты обратно к исходному списку?

Как вызвать несколько наблюдаемых в наблюдаемой и пометить ее как завершенную, только когда все дочерние наблюдаемые возвращены, все в NGRX?

1 Ответ

0 голосов
/ 14 ноября 2018

Для этого можно использовать оператор flatMap . С помощью этого оператора вы сопоставляете каждый элемент с наблюдаемой, а затем они объединяются вместе, так что в итоге у вас есть одна наблюдаемая со всеми элементами. Вот простой пример: 

const items: Observable<Item | number> = of(new Item(1, 'Name1'), 3, 4, new Item(1, 'Name2'));

const outputItems: Observable<Item> = items.pipe(
  mergeMap((x: Item | number) => {
    if (typeof x === 'number') { // it is a key call service
      return of(new Item(x, `Name${x}`)); // here you call the service to get the item 
    } else {
      return of(x); //return observable directly from item
    }
  })
);

Используйте оператор concatMap , если вы хотите сохранить порядок элементов.

...