Bootstrap Angular 2 application avec un fournisseur qui nécessite une initialisation asynchrone

Question

Je souhaite conserver ma configuration de l'application Angular 2 dans un fichier config.json distinct qui est chargé lorsque l'application est amorcée.

Je prévois de diffuser les données de configuration via ConfigService. Mais il doit extraire les données du fichier avant que tout autre composant puisse le demander.

Mon application est actuellement bootstrapped comme ceci:

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; 
import { AppComponent, routes } from './app'; 
... 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    routes 
    ], 
    declarations: [ 
    AppComponent 
    ], 
    [ 
    ConfigService, 
    ... 
    ], 
    bootstrap: [AppComponent] 
}) 
export class AppModule {} 

platformBrowserDynamic().bootstrapModule(AppModule) 

Je cherche donc un moyen comment initialiser le ConfigService avant l'application bootstrapper. Ou peut-être initez-le lorsque l'application est amorcée mais faites attendre le consommateur jusqu'à ce que le chargement soit terminé.

Answer 1

Après haut niveau peuvent: travaux

1. envelopper votre application actuelle dans un ShellComponent qui suit modèle

   <div *ngIf="ready"> 
       <app-component></app-component> 
   </div> 
   

2. ShellComponent appellera ConfigService dans ngOnInit(). Dans le jeu de rappel ready à true lorsque ConfigService renvoyer la configuration.

Au lieu de bootstrapping AppComponent, vous ShellComponent amorcer sur.