Angular 2使用Promise / Observable中的值设置APP_BASE_HREF

Question

我尝试使用异步rest调用中的值在“ CoreModule”中设置APP_BASE_HREF。我看不到如何完成此操作，因为provide方法需要返回一个字符串。

例如：

@NgModule({
    imports: [
        ...
        HttpModule
    ],
    ...
    providers: [
        ...
        ...
        BackendRequestClass,
        { provide: APP_BASE_HREF, useFactory: () => () => return '/some/path', deps: [], multi: true }
    ],
});

但是当我需要Web服务中的值时，无法返回该字符串。任何想法如何做到这一点？

谢谢

Answer 1

我尝试了您的解决方案。问题是，当时

{ provide: APP_BASE_HREF, useFactory: (config) => config.appBaseHref, deps: [ConfigService] }

尚未设置config.appBaseHref。当我调试代码时，看到的APP_INITIALIZER是在提供者从APP_BASE_HREF

这导致BASE_HREF未设置。

Answer 2

您可以使用APP_INITIALIZER提前获取路径，然后使用依赖项，如Angularjs2 - 在应用程序启动之前预加载服务器配置中所示

export function loadConfig(config: ConfigService) => () => config.load()

@NgModule({
    declarations: [AppComponent],
    imports: [BrowserModule,
        routes,
        FormsModule,
        HttpModule],
    providers: [
        ConfigService,
        BackendRequestClass,
        { provide: APP_INITIALIZER,
          useFactory: loadConfig,
          deps: [ConfigService], 
          multi: true },
        { provide: APP_BASE_HREF, useFactory: (config) => config.appBaseHref, deps: [ConfigService] }

    ],
    bootstrap: [AppComponent]
})
export class AppModule { }

可以ConfigService注入BackendRequestClass或Http获取数据，然后使用其属性使其可用appBaseHref（只是一个如何完成的示例）。