未捕获的错误:模块'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. 导入 modules和不 components或services
2. 声明 components，不 modules或services.
3. 提供 services和不 components或modules.

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批注的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！