Want to pre-load all the API call on the landing page itself in Angular8. Do we have any default mechanism?

Issue

I want to call all the APIs on the landing page itself (instead of calling the APIs on the respective pages due to performance)

Created a service and calling the all dispatch ngrx actions to call the APIs.

Is this a better approach or is there any default mechanism?

Any better suggestion/approach?

Solution

You could also have your effects listening to the ROOT_EFFECTS_INIT action. This action is dispatched automatically when the effects were initiated.

myFirstEffect$ = createEffect(() => 
  this.actions$.pipe(
     ofType(MyFirstAction, ROOT_EFFECTS_INIT),
     map(action => ...)
  )
);

mySecondEffect$ = createEffect(() => 
  this.actions$.pipe(
     ofType(MySecondAction, ROOT_EFFECTS_INIT),
     map(action => ...)
  )
);

Or - if this is too early - implement your own init action and dispatch it in the APP_INITIALIZER or when your app is ready.

Answered By - Jan