7

What is the difference between createEffect vs @Effect annotation in ngrx?

@Injectable()
export class ContactsEffects {

constructor(
    private actions$: Actions,
    private contactsService: ContactsService,
    private contactsSocket: ContactsSocketService
  ) {}


  destroy$ = createEffect( () => this.actions$.pipe(
    ofType(remove),
    pluck('id'),
    switchMap( id => this.contactsService.destroy(id).pipe(
      pluck('id'),
      map(id => removeSuccess({id}))
    ))
  ));

  @Effect()
  liveCreate$ = this.contactsSocket.liveCreated$.pipe(
    map(contact => createSuccess({contact}))
  );

}

1 Answer 1

15

@ngrx/effects createEffect for type safety As alternative to the @Effect() decorator, NgRx 8 provides the createEffect function. The advantage of using createEffect is that it’s type-safe, if the effect does not return an Observable<Action> it will give compile errors. The option { dispatch: false } still exists for effects that don’t dispatch new Actions, adding this option also removes the restriction that an effect needs to return an Observable<Action>.

Starting from NgRx 8 by default, automatically resubscribe to the effect when this happens. This adds a safety net for where the unhappy paths were missed. It’s possible to turn this feature off by setting resubscribeOnError to false at the effect level. example:

login$ = createEffect(() => .....), { resubscribeOnError: false });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.