CODEWITHSUNDEEP
angularngrxngrx-effects
Frank Spin
Frank Spin

Reputation: 1483

Dispatch multiply actions in order in effect - ngrx

I'm wondering how I dispatch multiply actions in order in my effect.

  @Effect()
  getClients$: Observable<Action> = this.actions$
    .ofType(ClientActions.GET_CLIENTS)
    .withLatestFrom(this.store.select(fromRoot.getClients))
    .filter(([action, clients]) => clients.length === 0)
    .map(action => new LayoutActions.IsLoading(true))
    .switchMap(() => this.clientService.getClients())
    .map(clients => new ClientActions.GetClientsReceived(clients));

In the above example the first action is not dispatched. The getClients() method and last action are working correctly.

Upvotes: 2

Views: 2111

Answers (3)

Ghetolay
Ghetolay

Reputation: 3342

Every action emitted by your observable will be dispatched so what you need is map an action to multiple actions. You can do that by adding the loading action with startWith() on your switchMap() :

.switchMap(action => {
  this.clientService.getClients()
    .map(clients => new ClientActions.GetClientsReceived(clients) as Action)
    .startWith(new LayoutActions.IsLoading(true))
);

Sometimes typings can be wrong, typescript will use the specific type of your action instead of Action. In this case after the map, the Observable is typed as Observable<ClientActionReceived> so returning a LayoutActionLoading inside startWith seems wrong for typescript.
To avoid that you need to cast one of the two as Action so it'll know it's an Observable<Action>.

Upvotes: 6

Julia Passynkova
Julia Passynkova

Reputation: 17879

i am doing it like that:

userRoleChange$: Observable<Action> = this.actions$
 .ofType(userActions.USER_SWITCH_ROLE)
 .switchMap(() => Observable.of(
   {type: preFlightActions.PRE_FLIGHT_CLEAR, payload: {}},
   {type: detailPlanningActions.DETAIL_PLANNING_CLEAR, payload: {}},
   {type: uploadsActions.UPLOAD_FILTER_SET, payload: {}}
 ));

Upvotes: 0

Eraldo
Eraldo

Reputation: 545

You can use the do operator.

Example: .do(dispatchAction(...))

Upvotes: 0

Related Questions