Ngrx разделить действие элементов на несколько действий элемента - PullRequest
0 голосов
/ 22 мая 2018

Я пытаюсь создать эффект Ngrx, который загружает сообщения от нескольких пользователей.У меня уже есть рабочий эффект, который загружает посты одного пользователя.Как я могу разделить эффект LoadUsersPosts на несколько эффектов LoadUserPosts?

Это то, что я пытаюсь прямо сейчас.

 @Effect() loadUsersPosts$ = this.actions$
.ofType(LOAD_USERS_POSTS)
.mergeMap((action: LoadUsersPosts) => {
  const array = [];
  action.payload.forEach(user => {
    array.push(new LoadPosts(user));
  });
  return array;
});

Я поместил некоторые console.log в forEach, но это нене кажется, что это даже выполняется.

Ответы [ 2 ]

0 голосов
/ 24 мая 2018

это может быть достигнуто с помощью кода ниже

@Effect()
  loadUsersPosts$ = this.actions$
    .ofType(LOAD_USERS_POSTS)
    .pipe(
      switchMap((action: LoadUsersPosts) => from(action.payload)),
      map(user => new LoadPosts(user))
    );

здесь оператор switchMap преобразует внешнюю наблюдаемую в несколько внутренних наблюдаемых на основе массива "action.payload", используя "из" Observable creator

"from" Observable создатель создаст наблюдаемый поток из массива, выдавая по одному значению за раз.

оператор карты преобразует это в действие.

Оператор switchMap предпочтительнее, чем mergeMap.mergeMap предоставит вывод для всего запроса, в то время как switchMap отменит все, кроме последнего запроса

0 голосов
/ 22 мая 2018

Похоже, что основная задача, которую вы хотите выполнить, - преобразовать и по отдельности выдать значения из массива в наблюдаемом потоке.Вы можете выполнить преобразование так же, как вы делаете сейчас, хотя map будет проще, чем forEach.Затем вы просто используете from для создания наблюдаемой из результирующего массива, который будет генерировать каждое значение последовательно.Вот упрощенный пример запуска:

Rx.Observable.of([1,2,3,4,5])
  .mergeMap(x => {
    const transformed = x.map(y => y * 2);
    return Rx.Observable.from(transformed);
  })
  .subscribe(x => { console.log(x); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/rxjs/5.5.10/Rx.min.js"></script>
...