在加载核心模块之前读取JSON文件

我正在使用angular来构建我的项目。我想在构建项目后更改API端点。为此，我在assets文件夹中创建了JSON文件，所有服务文件都从该文件中读取数据。JSON文件中的数据也可以在构建项目后更改。但问题是，在加载JSON文件之前执行的core.module.ts中需要API端点。因此JSON文件中的数据总是未定义的。是否可以在core.module.ts之前加载JSON文件，这样就不会出现问题

JSON文件

{
    "env": {
         "name": "dev"
    },
    "apiServer": {
        "url": "/api"
    }
}

app.config.ts

export class AppConfig {
    constructor(private http: Http) {}

    load() {
        const jsonFile = `assets/config/config.${environment.name}.json`;
        return new Promise<void>((resolve, reject) => {
            this.http.get(jsonFile).toPromise().then((response: Response) => {
                AppConfig.settings = response.json();
                resolve();
             }).catch((response: any) => {
                 reject(`Could not load file '${jsonFile}': ${JSON.stringify(response)}`);
             });
        });
    }
}

export function initializeApp(appConfig: AppConfig) {
    return () => appConfig.load();
}

providers: [
    AppConfig,
    { provide: APP_INITIALIZER,
    useFactory: initializeApp,
    deps: [AppConfig], multi: true },
    { provide: APP_BASE_HREF, useValue: '/' },
]

---

APP_初始值设定项注入令牌是运行代码的最佳方式。您需要钩住应用程序init进程并加载。为此，您必须在

app.module.ts

文件中创建AppConfig：

 export function appConfigFactory(provider: AppConfig): Function {  
  return () => provider.load();
}



  providers: [
    HttpModule,
    StartupService,
    Title,
    {
      provide: APP_INITIALIZER,
      useFactory:appConfigFactory,
      deps: [AppConfig],
      multi: true
    }

因此，我建议您阅读以下内容：

要了解更多信息，请阅读以下内容：

---

能否提供一些代码和有关环境的详细信息数据已正确加载到组件中。我想将数据加载到core.module.ts中。我已经实现了您共享的代码。但是它会在core.module.ts之后执行。请阅读本文，向您展示如何在http.get调用之前运行它：请确保您在

app.module.ts

中执行了

export function AppConfig

，当然我已经实现了它。它工作正常唯一的问题是它是在core.module.ts之后加载的，这会在您的

app.module.ts'中导致错误

useFactory:`应该与导出中的

提供者：

匹配，并且您应该将两者添加到

app.module.ts