ngrx / store

RxJS powered state management for Angular applications, inspired by Redux
MIT License
3.9k stars 310 forks source link

Action dispatch results in multiple complete actions #457

Closed blaur closed 7 years ago

blaur commented 7 years ago

Hi guys,

Hoping to get some help with a problem I simply can't get my head around. Here is a short description followed by the code. I'm dispatching an edit event of a booking which is picked up by an effect. The effect returns a complete action with the result. I then have a dispatcher listening on the complete action to provide the user with feedback when finished. This all works quite well but the problem is the following: The first time I perform the action there is only one complete action result as expected. The second time there is two even though only one edit action is dispatched, third time 3, ect...... Antbody who can explain how I can get around this?

I'm dispatching an edit event to the store: this.dispatcher.dispatch(new privateCalendarActions.EditPrivateBookingDetailAction( name, start, end ) );

This is then picked up by my effect:

@Effect()
  EditPrivateBookingDetail$: Observable<Action> = this.actions$
    .ofType(calendarAction.EDIT)
    .mergeMap((action:calendarAction.EditPrivateBookingDetailAction) => {
      return action.booking_details.save( { name: action.name, start: action.start, end: action.end }).map(( bookingDetail: PrivateBookingDetail) => {
        return new calendarAction.EditPrivateBookingDetailCompleteAction(bookingDetail);
      });
    });

I can see that the effect is only called once but the result is still a lot of Complete Actions (the number in which I have performed the task, so 1 = 1 response, 5 = 5 responses but still with only one dispatch).

I want to provide the user with feedback I'm using the dispatcher (Dispatcher from the @ngrx/store package) to listen on events (I have tried subscriping diretly to the effect but no difference):

this.dispatcher.filter(action => action.type === privateCalendarActions.EDIT_COMPLETE).subscribe(
      (action: privateCalendarActions.EditPrivateBookingDetailCompleteAction) => {
            .......
            ......
            this.editedAppointmentMessage();

      }
    );

Maybe I am misunderstanding the best practices here.

Thanks in advance.

Best regards, Brian

rupeshtiwari commented 7 years ago

@blaur In the effect why don't you use switchmap instead of mergemap?

blaur commented 7 years ago

@roopkt I started out with switchMap but i ended up trying mergeMap to see if it made a difference. It did not. And really, in this example I can't really see why mergeMap is not okay.

But I'be been reading issues and found this: https://github.com/ngrx/store/issues/147

It seems like my description is really how it is supposed to work. I've now added take(1) as described in the above issue.

robwormald commented 7 years ago

Please take how-to questions to https://gitter.im/ngrx/platform - GitHub is for issue reports and bugs.