angular - 从服务中为提供商获取价值

Question

我正在尝试将一些值（我从 http 请求中获得）从另一个服务分配给app.module.ts.

我的服务如下所示：

@Injectable()
export class AppConfigService {
      private appConfig: AppConfig;

      constructor(private http: HttpClient) {}

      loadConfigurationData = () => {
        this.http.get('assets/config/config.json').subscribe(
          (response: AppConfig) => {
            this.appConfig = response;
          },
          error => {
            this.appConfig = {
              baseHref: '/'
            };
          }
        );
};

      getBaseHref(): string {
        return this.appConfig.baseHref;
      }
}

在我的app.module.ts我试图获得这样`baseHref`的价值：

@NgModule({  
providers: [
        ...
        AppConfigService,
        {
          provide: APP_INITIALIZER,
          useFactory: (appConfigService: AppConfigService) => () => {
            appConfigService.loadConfigurationData();
          },
          deps: [AppConfigService],
          multi: true
        },
        {
          provide: APP_BASE_HREF,
          useFactory: getBaseHref,
          deps: [AppConfigService],
          multi: true
        },
        ...
      ],
})

export function getBaseHref(appConfigService: AppConfigService): string {
      return appConfigService.getBaseHref();
}

但我得到一个错误：`Cannot read property 'baseHref' of undefined`。

看起来服务没有初始化，但为什么？将此变量从服务传递给提供者的最佳方式是什么？

Answer 1

由于您依赖异步数据来更新您的 appconfig 变量，因此最初它是未定义的

Appconfig 必须初始化：

 private appConfig: AppConfig = {baseref: null} // or default