某些CommonModule指令在嵌套模块上不起作用

时间:2018-08-01 08:23:18

标签: angular

我有一个模块(模块A),其中包含试图使用ngClass的组件。单独运行此模块(例如,使用故事书)可以正常运行。

我是一个将ModuleA导入到导出ModuleA的全局模块中的应用。然后,我有懒加载的moduleB并导入了全局模块。到目前为止,一切都很好。现在,我尝试使用moduleA中的组件,并且页面以

爆炸
Uncaught Error: Uncaught (in promise): Error: StaticInjectorError(AppModule)[NgClass -> KeyValueDiffers]: 
  StaticInjectorError(Platform: core)[NgClass -> KeyValueDiffers]: 
    NullInjectorError: No provider for KeyValueDiffers!
Error: StaticInjectorError(AppModule)[NgClass -> KeyValueDiffers]: 
  StaticInjectorError(Platform: core)[NgClass -> KeyValueDiffers]: 
    NullInjectorError: No provider for KeyValueDiffers!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (VM17950 vendor.js:39808)
    at resolveToken (VM17950 vendor.js:40046)
    at tryResolveToken (VM17950 vendor.js:39990)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (VM17950 vendor.js:39887)
    at resolveToken (VM17950 vendor.js:40046)
    at tryResolveToken (VM17950 vendor.js:39990)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (VM17950 vendor.js:39887)
    at resolveNgModuleDep (VM17950 vendor.js:47125)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (VM17950 vendor.js:47813)
    at resolveNgModuleDep (VM17950 vendor.js:47125)
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get (VM17950 vendor.js:39808)
    at resolveToken (VM17950 vendor.js:40046)
    at tryResolveToken (VM17950 vendor.js:39990)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (VM17950 vendor.js:39887)
    at resolveToken (VM17950 vendor.js:40046)
    at tryResolveToken (VM17950 vendor.js:39990)
    at StaticInjector.push../node_modules/@angular/core/fesm5/core.js.StaticInjector.get (VM17950 vendor.js:39887)
    at resolveNgModuleDep (VM17950 vendor.js:47125)
    at NgModuleRef_.push../node_modules/@angular/core/fesm5/core.js.NgModuleRef_.get (VM17950 vendor.js:47813)
    at resolveNgModuleDep (VM17950 vendor.js:47125)
    at resolvePromise (VM17944 polyfills.js:7582)
    at resolvePromise (VM17944 polyfills.js:7539)
    at VM17944 polyfills.js:7641
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (VM17944 polyfills.js:7189)
    at Object.onInvokeTask (VM17950 vendor.js:42564)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (VM17944 polyfills.js:7188)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (VM17944 polyfills.js:6956)
    at drainMicroTaskQueue (VM17944 polyfills.js:7363)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (VM17944 polyfills.js:7268)
    at invokeTask (VM17944 polyfills.js:8308)

如果我从moduleA的组件中删除ngClass引用,则错误消失。搜索“ KeyValueDiffers的没有提供者”几乎没有结果。

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    GlobalModule,
    BrowserModule
  ],
  bootstrap: [AppComponent],

})
export class AppModule { }



@NgModule({
  imports: [
    CommonModule,
    ModalModule
  ],
  exports: [
    CommonModule,
    ModalModule
  ]
})
export class GlobalModule {}

此模块延迟加载:

@NgModule({
  imports: [
    SettingsRoutingModule,
    GlobalModule
  ],
  declarations: [
  ]
})
export class SettingsModule { }

这是我尝试在SettingsModule中使用的组件的模块

@NgModule({
  declarations: [
    ModalComponent
  ],
  imports: [
    CommonModule
  ],
  providers: [],
  exports: [
    ModalComponent
  ]
})
export class ModalModule { }

在其他任何地方使用ngClass都没有问题,例如通过SettingsModule定义和声明的组件。

1 个答案:

答案 0 :(得分:0)

与目录层次结构中某个地方的流氓node_modules文件夹有关的问题导致了许多角度文件的加载,这似乎使它感到困惑。