Angular如何在应用初始化时运行代码详解

import { NgModule, APP_INITIALIZER } from '@angular/core';
import { HttpClientModule } from "@angular/mon/http";
 
import { AppLoadService } from './app-load.service';
 
export function init_app(appLoadService: AppLoadService) {
 return () => appLoadService.initializeApp();
}
 
export function get_settings(appLoadService: AppLoadService) {
 return () => appLoadService.getSettings();
}
 
@NgModule({
 imports: [HttpClientModule],
 providers: [
 AppLoadService,
 { provide: APP_INITIALIZER, useFactory: init_app, deps: [AppLoadService], multi: true },
 { provide: APP_INITIALIZER, useFactory: get_settings, deps: [AppLoadService], multi: true }
 ]
})
export class AppLoadModule { }

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/mon/http';
import 'rxjs/add/operator/toPromise';
 
import { APP_SETTINGS } from '../settings';
 
@Injectable()
export class AppLoadService {
 
 constructor(private httpClient: HttpClient) { }
 
 initializeApp(): Promise<any> {
 return new Promise((resolve, reject) => {
   console.log(`initializeApp:: inside promise`);
 
   setTimeout(() => {
   console.log(`initializeApp:: inside setTimeout`);
   // doing something
 
   resolve();
   }, 3000);
  });
 }
 
 getSettings(): Promise<any> {
 console.log(`getSettings:: before http.get call`);
 
 const promise = this.httpClient.get('http://private-1ad25-initializeng.apiary-mock./settings')
  .toPromise()
  .then(settings => {
  console.log(`Settings from API: `, settings);
 
  APP_SETTINGS.connectionString = settings[0].value;
  APP_SETTINGS.defaultImageUrl = settings[1].value;
 
  console.log(`APP_SETTINGS: `, APP_SETTINGS);
 
  return settings;
  });
 
 return promise;
 }
}