Angular 16库中无法传递forRoot接收的配置对象至AngularFire

核心问题在于Angular模块的@NgModule元数据是静态解析的，模块定义阶段无法获取forRoot方法传入的动态配置。直接在imports里写AngularFireModule.initializeApp({})属于硬编码空配置，没法动态替换。

正确实现方式 #

修改模块结构，把AngularFireModule.initializeApp的初始化逻辑移到forRoot方法中，通过动态返回的ModuleWithProviders注入配置：

import { NgModule, ModuleWithProviders } from '@angular/core';
import { HttpClientModule } from '@angular/common/http';
import { AngularFireModule } from '@angular/fire/compat';
import { AngularFirestoreModule } from '@angular/fire/compat/firestore';

import { IsFeatureEnabledDirective } from './directives/is-feature-enabled.directive';
import { ConfigFirebase } from './interfaces/config-firebase.interface';
import { FeatureFlagsService } from './services/feature-flags.service';
import { BASE, FIREBASE_CONFIG, CONSTRAINTS } from './constants/tokens';

@NgModule({
  declarations: [
    IsFeatureEnabledDirective,
  ],
  imports: [
    HttpClientModule,
    // 仅导入AngularFireModule，不在此处初始化
    AngularFireModule,
    AngularFirestoreModule,
  ],
  exports: [
    IsFeatureEnabledDirective,
  ]
})
export class FeatureFlagsModule {
  constructor(private featureFlagService: FeatureFlagsService) { }

  static forRoot(
    config: ConfigFirebase,
    options: { base: string, identity?: {} }): ModuleWithProviders<FeatureFlagsModule> {

    return {
      ngModule: FeatureFlagsModule,
      // 在这里动态传入配置初始化AngularFire
      imports: [
        AngularFireModule.initializeApp(config)
      ],
      providers: [
        {
          provide: FIREBASE_CONFIG,
          useValue: config
        },
        {
          provide: BASE,
          useValue: options.base
        },
        {
          provide: CONSTRAINTS,
          useValue: options.identity,
        },
      ],
    };
  }
}

之前方案无效的原因 #

• APP_INITIALIZER：属于运行时初始化逻辑，而AngularFireModule.initializeApp需要在模块初始化阶段完成，运行时配置无法回溯到模块解析阶段。
• Inject方法：仅能在组件/服务的构造函数中使用，模块的@NgModule元数据是静态的，无法在其中注入依赖。

额外注意事项 #

• 确保使用该库的应用仅在根模块中调用FeatureFlagsModule.forRoot()，避免重复初始化AngularFire。
• Angular 16中ModuleWithProviders可省略泛型，但保留<FeatureFlagsModule>能获得更优的类型提示。

内容的提问来源于stack exchange，提问作者Luis