未捕获的错误:由模块“AppModule"导入的意外指令“MyComboBox".请添加@NgModule 注释

问题描述

我有一个自定义组件 (MyComboBox)，里面有 kendo-combobox.

I've a custom component (MyComboBox) which has kendo-combobox inside.

当我使用我的核心模块时，webpack 编译成功结束，但 chrome 抛出以下错误:

When I use my core module, webpack compilation ends successfully but chrome throws the following error:

Uncaught Error: Unexpected directive 'MyComboBox' imported by the module 'AppModule'. Please add a @NgModule annotation.

这是我的AppModule:

import { MyComboBox } from '@my/core/control/MyComboBox';

@NgModule({
    declarations: [
        AppComponent,
        MyComboBox
    ],
    imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        DragulaModule,
        MyComboBox,
        CoreModule,
        ComboBoxModule
    ],
    entryComponents: [ MyComboBox ],
    providers: [HelperService],
    bootstrap: [AppComponent]
})

推荐答案

EDIT :

当我们没有importing、providing或declaring角度modules时，经常会出现这个错误，services, components 正确.

This error frequently comes up when we are not importing, providing, or declaring the angular modules, services, components properly.

确保我们应该只

1. import modules 和 NOT components 或 services
2. 声明 components 和NOT modules 或 services.
3. 提供 服务和NOT 组件或模块.

1. import modules and NOT the components or services
2. declare components and NOT the modules or services.
3. provide services and NOT components or modules.

原答案:

您不必在应用模块中真正导入 MyComboBox.由于您已经在 CoreModule 中导出了它.因此，我建议您从 AppModule 中的导入数组中删除 MyComboBox.导入 CoreModule 将在 AppModule 中为您提供 MyComboBox 组件.

You don't have to really import MyComboBox in your App Module. Since you have already exported it in CoreModule. So I would suggest you to remove MyComboBox from your imports array in AppModule. Importing CoreModule will give you MyComboBox component within AppModule.

app.module.ts

app.module.ts

@NgModule({
      declarations: [
      AppComponent,
      MyComboBox
     ],


    imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    DragulaModule,
    CoreModule
   ],
  // viewProviders: [ DragulaService ],
  providers: [HelperService],
  bootstrap: [AppComponent]
})

注意:您不能像在那里那样自由地导入组件.它必须包含在要导入的模块中.

Note : You cannot import component freely like you are doing there. It has to be contained within the module to be imported.

这篇关于未捕获的错误:由模块“AppModule"导入的意外指令“MyComboBox".请添加@NgModule 注释的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！