Angular 2 - Services consuming others services before call a method

Question

I\'ve this scenario.

backend.json

{
\"devServer\": \"http://server1/\'\",
\"proServer\" : \"http://server2/\'\",
\"use\" :  \"devServer\"
}


        

Answer 1

I think that you could preload such hints at the application startup. For this, you could leverage the APP_INITIALIZER service. The application will wait for the returned promise to be resolved before actually starting.

Here is a sample:

provide(APP_INITIALIZER, {
  useFactory: (service:GlobalService) => () => service.load(),
  deps:[GlobalService, HTTP_PROVIDERS], multi: true
})

The load method would like something like that:

load():Promise<Site> {
  var promise = this.http.get('config.json').map(res => res.json()).toPromise();
  promise.then(config => this.devServer = config.devServer);
  return promise;
}

Then you can directly use the devServer (synchronously)...

See this issue on github for more details:

• https://github.com/angular/angular/issues/9047