initialize angular configuration initialization angular-cli

initialize angular



Angular4 APP_INITIALIZER no retrasará la inicialización (1)

Mecanografía: 2.2.0 Angular: 4.0

Estoy intentando asegurar que un objeto ConfigService se inicialice antes del inicio de la aplicación mediante el uso de APP_INITIALIZER . He encontrado muchos ejemplos de cómo hacer esto, sin embargo, ninguno de ellos parece estar retrasando la inicialización de la aplicación. Aquí hay algunos ejemplos que he intentado implementar.

https://github.com/angular/angular/issues/9047 https://gist.github.com/fernandohu/122e88c3bcd210bbe41c608c36306db9 Angular2 APP_INITIALIZER no consistente

Aquí está mi clase de NgModule

export function init(config: ConfigService) { return () => { config.load(); }; } @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, FormsModule, HttpModule, AppRoutingModule ], providers: [ { ''provide'': APP_INITIALIZER, ''useFactory'': init, ''deps'': [ConfigService], ''multi'': true }, ConfigService ], bootstrap: [AppComponent] }) export class AppModule { }

Y aquí está la clase ConfigService

@Injectable() export class ConfigService { private config: ApplicationConfiguration; get apiRoot() { return this.getProperty(''apiRoot''); // <--- THIS GETS CALLED FIRST } constructor(private http: Http) { } load(): Promise<any> { console.log(''get user called''); const promise = this.http.get(''./../../assets/config.json'').map((res) => res.json()).toPromise(); promise.then(config => { this.config = config; // <--- THIS RESOLVES AFTER console.log(this.config); }); return promise; } private getProperty(property: string): any { //noinspection TsLint if (!this.config) { throw new Error(`Attempted to access configuration property before configuration data was loaded, please double check that ''APP_INITIALIZER is properly implemented.`); } if (!this.config[property]) { throw new Error(`Required property ${property} was not defined within the configuration object. Please double check the assets/config.json file`); } return this.config[property]; } }

Y para probar todo lo que he inyectado ConfigService en AppComponent con esto.

import { Component } from ''@angular/core''; import {ConfigService} from ''./services/config.service''; @Component({ selector: ''app-root'', templateUrl: ''./app.component.html'', styleUrls: [''./app.component.scss''] }) export class AppComponent { title = ''app works!''; fullImagePath = ''/src/image/avatar.jpeg''; constructor(private config: ConfigService) { config.apiRoot; } }


Parece que se olvidó de devolver el valor de fábrica:

export function init(config: ConfigService) { return () => { return config.load(); // add return }; }

o el mismo código se puede escribir un poco en breve:

export function init(config: ConfigService) { return () => config.load(); }