Как отправить несколько действий в ngrx / effect (redux-observable)?

Эффект преобразует поток действий, поэтому у вас есть поток действий в качестве ввода и вывода. В вашем примере вы сопоставляете действие с массивом действий. Поток массивов действий не является допустимым типом вывода. Вам нужно сгладить этот массив, что означает, что вы не испускаете сам массив в выходной поток, а вместо этого отправляете каждый из его элементов.

Вместо того:

input:  --a-------a------>
output: --[b,c]---[b,c]-->

Ты должен сделать:

input:  --a-------a------>
output: --b-c-----b-c-->

Для сглаживания наблюдаемого массива в Observable каждого элемента вы можете использовать один из операторов mergeMap, switchMap, exhaustMap. В большинстве случаев mergeMap будет правильным выбором. Если вы хотите узнать больше об этих операторах, прочтите этот ответ.

@Effect()
register$: Observable<Action> = this.actions$.pipe(
  ofType(AuthActionTypes.REGISTER_REQUEST),
  mergeMap((action: RegisterRequest) => {
    // check for register request success
    return [
      new RegisterSuccess(),
      new LoginRequest(action.payload)
    ]
  })
);

У меня была такая же ситуация (и предполагая, что NgRx 10 или выше), у меня другая точка зрения, более фундаментальный способ использования эффектов. Последовательный запуск нескольких действий в одном месте, особенно в рамках одного эффекта, является анти-паттерном. По сути, важно поддерживать согласованный общий поток состояний приложения в NgRx действий и потенциалов. сокращения. Так же, как это предусмотрено архитектурой NgRx.

После 3 правила эффекта уже помогут избежать сложных ситуаций:

1. Назовите эффекты как название эффекта
2. Сделайте так, чтобы ваш эффект делал только одно
3. Выпустить только одно действие

Таким образом, это поможет вам следовать шаблону проектирования разделения проблем, который, конечно, также поможет вам эффекты NgRx, чтобы сделать их более пригодными для модульного тестирования.

Вернемся к вашему примеру, вы можете просто отделить то, что вы хотите сделать (2 дополнительных действия), с помощью промежуточного действия.

В вашем случае кажется, что вам может не понадобиться даже ваш исходный эффект dispathMultipleActions $, если внутри не появится особая логика. (который, возможно, может принадлежать редуктору состояния, который еще более поддается модульному тестированию).

Предполагая, что ActionTypes.UpdateSomething уже имеет объект полезной нагрузки массива, вы можете разделить свои dispathMultipleActions $ на отдельные, чтобы сделать что-то вроде этого:

@Effect()
deleteAction$ = this.actions$.pipe(
    ofType(ActionTypes.UpdateSomething),
    concatMap(from(new Promise((array) => {
        array.forEach(item => {
            if (item > 3) {
                //do something
            }
        });
    }))),
    {dispatch: false}
);

@Effect()
changeAction$ = this.actions$.pipe(
    ofType(ActionTypes.UpdateSomething),
    concatMap(from(new Promise((array) => {
        array.forEach(item => {
            if (item <= 3) {
                //do something
            }
        });
    }))),
    {dispatch: false}
);

У меня была такая же проблема с Ngrx 10, и решение с возвратом массива, похоже, больше не работает ...

Мое решение - использовать this.store$.dispatch( myAction(...) )

`

mergeMap((action: RegisterRequest) => {
  // check for register request success

  // for all actions from 0 to (last -1), use a dispatch() :
  this.store$.dispatch( RegisterSuccess() );

  // and the last action is returned:
  return LoginRequest(action.payload);

})