@ngrx Effect does not run the second time

user_4094935 0
Viewed 5194

I've just started learning about @ngrx/store and @ngrx.effects and have created my first effect in my Angular/Ionic app. It runs ok the first time but if I dispatch the event to the store again (i.e when clicking the button again), nothing happens (no network call is made, nothing in console logs). Is there something obvious I'm doing wrong? Here's the effect:

@Effect() event_response$ = this.action$
    .ofType(SEND_EVENT_RESPONSE_ACTION)
    .map(toPayload)
    .switchMap((payload) => this.myService.eventResponse(payload.eventId,payload.response))
    .map(data => new SentEventResponseAction(data))
    .catch((error) => Observable.of(new ErrorOccurredAction(error)));

Thanks

ngrx effects
2 Answers

You must move map() and catchError() into swithchMap() as following

@Effect()
public event_response$ = this.action$.pipe(
    ofType(SEND_EVENT_RESPONSE_ACTION),
    switchMap((payload) => {
        return this.myService.eventResponse(payload.eventId,payload.response).pipe(
            map((data: DataType) => new SentEventResponseAction(data)),
            catchError((error) => Observable.of(new ErrorOccurredAction(error)))
        })
    );
 );

Please note that, evetResponse() method inside myService should return an observable in order to use pipe afterward. In case your method inside service returns Promise, you can convert it into an observable by the use of from in the rxjs package as below:

import { from } from 'rxjs';
...
const promise = this.myService.eventResponse(payload.eventId,payload.response);
const observable = from(promise);
return observable.pipe(...

For more and detail description take a look at this link

user_55903800
Related