dispatch multiple actions in one effect

I would like to dispatch two actions in one effect. Currently I have to declare two effects to achieve this :

// first effect
@Effect()
action1$ = this.actions$
  .ofType(CoreActionTypes.MY_ACTION)
  .map(res => {
    return { type: "ACTION_ONE"}
  })
  .catch(() => Observable.of({
    type: CoreActionTypes.MY_ACTION_FAILED
  }));

// second effect
@Effect()
action2$ = this.actions$
  .ofType(CoreActionTypes.MY_ACTION)
  .map(res => {
    return { type: "ACTION_TWO"}
  })
  .catch(() => Observable.of({
    type: CoreActionTypes.MY_ACTION_FAILED
  }));

Is it possible to have one action, be the source of two actions via a single effect?


@Effect()
loadInitConfig$ = this.actions$
    .ofType(layout.ActionTypes.LOAD_INIT_CONFIGURATION)
    .map<Action, void>(toPayload)
    .switchMap(() =>
        this.settingsService
            .loadInitConfiguration()
            .mergeMap((data: any) => [
                new layout.LoadInitConfigurationCompleteAction(data.settings),
                new meetup.LoadInitGeolocationCompleteAction(data.geolocation)
            ])
            .catch(error =>
                Observable.of(
                    new layout.LoadInitConfigurationFailAction({
                        error
                    })
                )
            )
    );

You can use switchMap and Observable.of.

 @Effect({ dispatch: true }) action$ = this.actions$
    .ofType(CoreActionTypes.MY_ACTION)
    .switchMap(() => Observable.of(
        // subscribers will be notified
        {type: 'ACTION_ONE'} ,
        // subscribers will be notified (again ...)
        {type: 'ACTION_TWO'}
    ))
    .catch(() => Observable.of({
      type: CoreActionTypes.MY_ACTION_FAILED
    }));

Performance matters :

Instead of dispatching many actions that will trigger all the subscribers as many times as you dispatch, you may want to take a look into redux-batched-actions.

This allows you to warn your subscribers only when all of those multiple actions have been applied to the store.

For example :

@Effect({ dispatch: true }) action$ = this.actions$
    .ofType(CoreActionTypes.MY_ACTION)
    // subscribers will be notified only once, no matter how many actions you have
    // not between every action
    .map(() => batchActions([
        doThing(),
        doOther()
    ]))
    .catch(() => Observable.of({
      type: CoreActionTypes.MY_ACTION_FAILED
    }));