APP_INITIALIZER 加载服务调用 Angular 13

Question

我正在使用 Angular 13 并尝试通过使用 APP_INITIALIZER 令牌连接到 Angular 的引导阶段。需要创建 angular 服务来处理我们的远程配置的获取，但问题是不再支持，如何弃用它编写这个 loadAppConfig() 方法，因为 APP_INITIALIZER 只支持 Promise。 非常感谢任何帮助。

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class AppConfigService {
  private appConfig;

  constructor(private http: HttpClient) { }

  loadAppConfig() {
    return this.http.get('/assets/data/appConfig.json')
      .toPromise()
      .then(data => {
        this.appConfig = data;
      });
  }

  getConfig() {
    return this.appConfig;
  }
}

Answer 1

APP_INITIALIZER 处理 Promise 和 observables，来自文档： https://angular.io/api/core/APP_INITIALIZER

“如果这些函数中的任何一个返回 Promise 或 Observable”

他们的第二个例子展示了一个 observable：

function initializeAppFactory(httpClient: HttpClient): () => Observable<any> {
 return () => httpClient.get("https://someUrl.com/api/user")
   .pipe(
      tap(user => { ... })
   );
}

@NgModule({
  imports: [BrowserModule, HttpClientModule],
  declarations: [AppComponent],
  bootstrap: [AppComponent],
  providers: [{
    provide: APP_INITIALIZER,
    useFactory: initializeAppFactory,
    deps: [HttpClient],
    multi: true
  }]
})
export class AppModule {}