angular - NgModule 嵌套 forRoot

Question

考虑到有一个模块

@NgModule({
    imports: [
        Ng2Webstorage.forRoot({ prefix: 'SOME_PREFIX' }),
        FooModule.forRoot(...),
        BarModule,
    ],
    exports: [
        Ng2Webstorage,
        FooModule,
        BarModule,
    ]
})
class FeatureModule {
    static forRoot(config): ModuleWithProviders {
        return {
            ngModule: FeatureModule,
            providers: [...]
        };
    }
}

如何将 prefix 动态传递给 Ng2Webstorage.forRoot？喜欢:

@NgModule({
    imports: [
        BarModule,
    ],
    exports: [
        Ng2Webstorage,
        FooModule,
        BarModule,
    ]
})
class FeatureModule {
    static forRoot(config): ModuleWithProviders {
        return {
            ngModule: FeatureModule,
            imports: [
                Ng2Webstorage.forRoot({ prefix: config.name }),
                FooModule.forRoot(config.foo)
            ],
            providers: [...]
        };
    }
}

...
imports: [FeatureModule.forRoot({ name: `ANOTHER_PREFIX` }), ...]
...

是否可以嵌套调用forRoot？

看起来 ModuleWithProviders 不接受 imports。

Answer 1

是的，你是对的。我们不能将 imports 传递给 ModuleWithProviders 导入。

以下是 Angular 如何从此类导入中收集数据:

} else if (importedType && importedType.ngModule) {
    const moduleWithProviders: ModuleWithProviders = importedType;
    importedModuleType = moduleWithProviders.ngModule;
    if (moduleWithProviders.providers) {
      providers.push(...this._getProvidersMetadata(
          moduleWithProviders.providers, entryComponents,
          `provider for the NgModule '${stringifyType(importedModuleType)}'`, [],
          importedType));
}

https://github.com/angular/angular/blob/4.3.x/packages/compiler/src/metadata_resolver.ts#L448-L456

我们可以通过在 ModuleWithProviders.providers 中传递相同的提供者来覆盖 Ng2Webstorage.forRoot() 中声明的提供者，如下所示:

import {Ng2Webstorage, WEBSTORAGE_CONFIG} from 'ngx-webstorage';

@NgModule({
  imports: [
    Ng2Webstorage.forRoot()
  ],
  ...
})
export class FeatureModule {
  static forRoot(config): ModuleWithProviders {
    return {
      ngModule: FeatureModule,
      providers: [
        { provide: WEBSTORAGE_CONFIG, useValue: config }
      ]
    };
  }
}