通过从后端获取数据来设置从 app.module 导入

Question

在 Angular 中，是否可以通过从后端获取数据来设置从 app.module 导入？

RecaptchaFormsModule,
NgxStripeModule.forRoot(CONFIG.stripeKey),
AgmCoreModule.forRoot({
  apiKey: CONFIG.keyFromDServer,
  libraries: ["places"]
}),

因此，使用来自服务器的密钥设置 CONFIG.keyFromDServer。 APP_INITIALIZER 可以做到这一点，如果是这样，或者无论如何？

Answer 1

AOT 编译不允许在 Angular 装饰器中使用非静态可分析的值。

有几种选择。 这是一个在 boostrapping 应用程序之前等待来自服务器的配置。

// main.ts
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { configurationToken } from './app/configuration';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

// Platform creation and bootstrapping of the application is delayed
// until we have loaded the configuration file.
fetch('/assets/configuration.json')
  .then(configuration =>
    platformBrowserDynamic([
      { provide: configurationToken, useValue: configuration },
    ]).bootstrapModule(AppModule))
  .catch(error => console.error(error));

// configuration.ts
import { InjectionToken } from '@angular/core';

// We create an interface for the configuration JSON object
export interface Configuration {
  readonly apiUrl: string;
  readonly timezone: string;
  readonly websocketUrl: string;
}

// We use a dependency injection token to access the configuration
// in our application.
export const configurationToken = new InjectionToken('Configuration');

// time.service.ts
import { Inject, Injectable } from '@angular/core';

import { Configuration, configurationToken } from './configuration';

@Injectable()
export class TimeService {
  constructor(
    @Inject(configurationToken) private configuration: Configuration,
  ) {}

  // Configuration is available synchronously since it's just an object
  // that can be injected.
  get timezone(): string {
    return this.configuration.timezone;
  }
}

Kevin Kreuzer 的“ 在持续交付中处理 Angular 环境”中的更多选项。