Angular2 - How do I delay initial load until service completes?

Question

I have an angular2 RC6 application and I need to defer loading pages until after some functionality is executed.

I have a service that determines the URI for the webApi. I need the application to wait until this URL is determined before it tries to load any data. If I hide the main application in app.component, with an *ngIf, I get routing errors because the router outlet does not exists.

Before RC5/6 I manually bootstrapped the application after the service get's the URI.

Answer 1

If you use the router you can use canActivate, canActivateChild.

See also

• https://angular.io/docs/ts/latest/guide/router.html#!#guards
• Resolve a value *before* activating a route in Angular 2
• Angular2 canActivate() calling async function

For loading once before app initialization you can use APP_INITIALIZER as explained in How to pass parameters rendered from backend to angular2 bootstrap method