如何在 Angular 中为 app.modules.ts 加载环境数据

Question

我需要从包含环境数据的服务加载数据。我需要一些数据用于app.modules.

这是一个小app.modules.ts例子：

import { CustomEnvironmentService } from './CustomEnvironmentService';

let customService: CustomEnvironmentService;

@NgModule({
    declarations: [...],
    imports: [CustomModule.forRoot(customService.ENVIRONMENT_DATA)],
    providers: [...]
})
export class AppModule {}

首先要注意的是，customService.ENVIRONMENT_DATA它只是一个公共变量，CustomEnvironmentService它从名为env.js.

问题是应用程序加载的时间customService.ENVIRONMENT_DATA是未定义的。这是可以理解的，因为我很确定服务没有初始化并且没有获取数据。

我发现了一些叫做的东西，APP_INITIALIZER但似乎我可能无法使用它来读取该env.js文件，或者它将使用 my CustomEnvironmentService（从 中获取数据env.js）。

我的实现也基于这篇文章：How to use environment variables to configure your Angular application without a rebuild

有任何想法吗？

Answer 1

使用您链接的文章中的方法，您不能使用 an，APP_INITIALIZER因为在所有导入的模块初始化您已经发现的内容后，它们会被调用。

由于这种方法只是将环境设置设置为全局窗口属性，因此__env您只需在 Angular 中定义一个全局常量，即可从窗口分配环境设置的值。然后它将在所有应用程序中可用。这也将在应用程序启动时立即可用。

例如，您创建一个environment-data.ts包含以下内容的文件：

export const ENVIRONMENT_DATA = window['__env'];

然后只需在需要的地方导入常量并使用它。

import { ENVIRONMENT_DATA } from './environment-data';

@NgModule({
    declarations: [...],
    imports: [CustomModule.forRoot(ENVIRONMENT_DATA)],
    providers: [...]
})
export class AppModule {}