Angular无法从configuration.js加载app.module.ts中的变量

在我的app.module.ts中，我正在从assets文件夹中的config/production.json加载配置变量，以便在构建部署到iis服务器后可以对其进行更改

local上的代码运行良好，它正在从configuration.json获取变量，但有一次构建部署完成后，它没有从config文件获取变量。这里是我的代码

My production.json文件

{
     "production": true,
     "LogInapiUrl": "https://keenucfrs_public.keenu.pk/Develop/API/Vouchers/LogIn",
     "RecaptchaKey":"6LcNeewZAAAAAA3prujTXoskl05x0qLYwFGzUDas",
     "VoucherByChannelIdAPI":"https://keenucfrs_public.keenu.pk/Develop/API/Vouchers/GetVouchersByChannelId/",
     "ChannelAPI": "https://keenucfrs_public.keenu.pk/Develop/API/Vouchers/GetChannels",
     "PortalPath":"/Develop/Portal/ClientApp/"
}

用于获取所有配置变量的Configservice

import { Injectable, APP_INITIALIZER } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs';
import 'rxjs/Rx';

@Injectable()
export class ConfigServiceService {

    private _config: Object
    private _env: string;

    constructor(private _http: Http) { }
    load() {
        return new Promise((resolve, reject) => {
            this._env = 'production';
            this._http.get('./assets/config/' + this._env + '.json')
                .map(res => res.json())
                .subscribe((data) => {
                    this._config = data;
                    resolve(true);
                },
                (error: any) => {
                    console.error(error);
                    return Observable.throw(error.json().error || 'Server error');
                });
        });
    }
    // Is app in the development mode?
    isDevmode() {
        return this._env === 'development';
    }
    // Gets API route based on the provided key
    getApi(key: string): string {
        return this._config["API_ENDPOINTS"][key];
    }
    // Gets a value of specified property in the configuration file
    get(key: any) {
        return this._config[key];
    }
}

export function ConfigFactory(config: ConfigServiceService) {
    return () => config.load();
}

export function init() {
    return {
        provide: APP_INITIALIZER,
        useFactory: ConfigFactory,
        deps: [ConfigServiceService],
        multi: true
    }
}

const ConfigModule = {
    init: init
}

export { ConfigModule };

在我的不同部门，它工作得很好

private  ChannelsAPI=this._configService.get("ChannelAPI");

 constructor(private httpClient: HttpClient,private _configService:ConfigServiceService ) {}

但是在app.module.ts文件中

---

提供者是在类之前声明的，因此不能在angular 10中使用它。实际上，我从一位同事那里得到了一些帮助，他建议以下内容用于正在工作的Recaptcha密钥

当他查看APP_初始值设定项时，出现以下工具提示：

*允许您提供一个或多个初始化函数的注入令牌。这些函数在应用程序启动时注入，并在应用程序初始化期间执行。如果这些函数中的任何一个返回一个承诺，则在该承诺得到解决之前，初始化不会完成

例如，您可以创建一个加载语言数据或外部配置的工厂函数，并将该函数提供给APP_初始值设定项令牌。这样，该函数在应用程序引导过程中执行，所需的数据在启动时可用*

APP_初始值设定项可以作为依赖项传递，并且您尝试运行的函数将在初始化之前执行

我尝试使用上面的代码来展示提供者如何初始化服务，然后提取Recaptcha密钥

      providers: [
        ConfigServiceService,
        {
          provide: APP_INITIALIZER,
          deps: [ConfigServiceService],
          useFactory: (configService: ConfigServiceService) => {
            return () => {
              //Make sure to return a promise!
              return configService.load();
            };
          },
          multi: true,
        },
        {
          provide: RECAPTCHA_V3_SITE_KEY,
          deps: [ConfigServiceService, APP_INITIALIZER],
          useFactory: (configService: ConfigServiceService) =>
            configService?.get("RecaptchaKey"),
        },
      ]

---

请在尝试获取值时提供结果。您收到错误了吗？{provide:RECAPTCHA\u V3\u SITE\u KEY，useValue:this.RecaptchaKey}，this.recaptchaKey未定义，但同一进程正在子组件上工作，而不是在app.module.tsthis.recaptchaKey对象可能未定义为什么不在

environment.ts

和

environment.prod.ts

中设置这些值？很抱歉，我错过了您的要求

，因此可以在构建完成后进行更改部署到iis服务器

。