Обрабатывать наблюдаемые в последовательности и ждать ввода пользователя - PullRequest
0 голосов
/ 04 января 2019

У меня есть массив элементов, которые мне нужно перебрать, чтобы проверить, отображать ли пользователю модальное диалоговое окно и дождаться ввода пользователя, прежде чем я продолжу итерацию. Массив обернут внутри наблюдаемой, как Observable<Array<Item>>;.

Для каждого элемента в массиве мне нужно проверить, присутствует ли его тип в объекте Map<ItemType, string>. Если он отсутствует, должен отображаться модальный режим, в котором пользователь вводит комментарий, а введенное значение должно храниться на карте. Если он присутствует, ничего не следует делать, итерация должна продолжаться. Я написал несколько псевдокодов о том, чего я хочу достичь ниже.

Map<ItemType, string> comments;
Observable<Array<Items>> items;

foreach (item in items) {
    if(comments[item.type]) {
        continue to next item;
    } else {
        show a modal dialog and wait for the userInput;
        onModalClose -> comments[item.type] = userInput
    }
}

Сам модал возвращает новую наблюдаемую оболочку ввода пользователя.

Что я не могу обернуть в голову, так это как ждать, пока завершится модальная наблюдаемая, прежде чем я продолжу итерацию наблюдаемого массива, способ RxJs . Делать это с цепочками обещаний не будет слишком запутанным

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

Моя последняя попытка такая же, как показано ниже, хотя я почти уверен, что это далеко не так, как должно быть.

this.items$.pipe( //Observable<Array<Item>>
      map(items => items.map(i => of(i))), //Convert to an Array<Observable<Item>>
      switchMap(items => { 
        return concat(...items).pipe(
          switchMap(item => {
            return this.showExtraInformationModal().pipe(
              map(resultFromModal => {
                // Use the result from modal 
              })
            );
          })
        )
      })
    ).subscribe();

Как правильно обрабатывать сценарий «Дождитесь ввода пользователя, а затем продолжайте!» с помощью наблюдаемых?

1 Ответ

0 голосов
/ 04 января 2019

Я думаю, вы довольно близки, всего несколько упрощений:

items$.pipe(
  mergeMap(items => items), //converts Observable<Array<T>> to a stream of T
  concatMap(item => 
    item.showModal ?
      showExtraInformationModal().pipe(
        map(resultFromModal => {
          // Use the result from modal 
        }))
      :
      of(item)
  )
).subscribe();

Использование concatMap буферизует входящие уведомления и ждет завершения внутреннего наблюдения, прежде чем двигаться дальше.

Ваш переключатель «Показать / Не показывать модальный» должен быть включен в функцию concatMap.

Демонстрация: https://stackblitz.com/edit/rxjs-sxeude?file=index.ts

...