Question

我正在使用Angular 2.4并在浏览器控制台中收到以下错误：

未处理的Promise拒绝：模板解析错误：'向导'不是   已知元素：   1.如果'wizard'是Angular组件，则验证它是否是此模块的一部分。   2.如果“向导”是Web组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到此组件的“@NgModule.schemas”以禁止显示此消息。   （“oduction-tour”class =“continue-tour”data-toggle =“modal”＆gt;继续   游览                      [错误 - ＆gt;]

“）：SellingComponent @ 79：8; Zone :;任务：Promise.then; Value：

如果我忘记在app.module文件中导入组件，这是我经常遇到的错误类型，但我没有忘记这一次。

这是我的 app.module.ts 文件：

import { WizardComponent } from './wizard.component';
import { WizardService }   from './wizard.service';

@NgModule({
    imports: [
        ...        
        SellingModule,
        GrowingModule,
    ],
    declarations: [
        ...
        WizardComponent,
    ],
    providers: [        
        ...
        WizardService        
    ],
    bootstrap: [ AppComponent ]
})

export class AppModule { }

growing.module.ts：

@NgModule({
    ...
    declarations: [
        GrowingComponent,
        ...
    ],
    ...
})
export class GrowingModule { }

selling.module.ts：

@NgModule({
    ...
    declarations: [
        SellingComponent,
        ...
    ],
    ...
})
export class SellingModule { }

growing.component.html

<wizard></wizard>

selling.component.html

<wizard></wizard>

wizard.component.ts

@Component({
    moduleId: module.id,
    selector: 'wizard',
    templateUrl: 'wizard.component.html',
})

如您所见，我正在尝试在两个不同的组件中使用<wizard></wizard>。我尝试在我的GrowingModule和SellingModule中导入我的WizardComponent而不是我的AppModule，但导入它两次出现了不同的错误，所以我认为我必须在AppModule中导入一次。如果我只将<wizard></wizard>放在grow.component.html中，然后只在GrowingModule中导入WizardComponent，它就可以工作。我需要做些什么才能在两个组件中使用<wizard></wizard>？

Answer 1

如果您希望在多个功能模块（即销售和增长模块）中重复使用通用组件，那么最好在共享模块中而不是AppModule中定义这些组件。

然后，您可以导入功能模块中所需的SharedModule。

请参阅this回答和Angular shared module文档。

“'向导'不是已知元素”错误，即使在导入该组件时也是如此

1 个答案: