NgRx Create Effect for API Call

lucycodes42

EffectName$ is a variable that will hold the name of the new effect. This effect will be created by calling createEffect(). The effects that are available in React are listed here.

The first parameter is a function that will be called every time an action is fired from the parent component. This function will receive two arguments: the action object and the current state of the children. The this.actions argument is an object that contains all of the action instances that are children of the component.

The second parameter is ofType(). This function will return a React Component type. This type will be used to determine how the function will be called. The function that is passed in as the second argument will be called every time an action is fired.

The third parameter is operator(). This function will be called every time an action is fired and the type of the action is not ofType(). This function will receive three arguments: the action object, the current state of the children, and an error object. The third parameter is an object that can be used to store information about the action. The key value pairs in this object will be relevant for the specific action that was fired.

The fourth and last parameter is apiSource. This function will

Library: angular

Shortcut: a_ngrx_create_effect_api

effectName$ = createEffect(() => {
  return this.actions$.pipe(
      ofType(FeatureActions.action),
      operator(() =>
        apiSource.pipe(
          map(data => Actions.Success({ data })),
          catchError(error => of(Actions.Failure({ error }))))
        ),
  );
});