Angular 2找不到我的功能模块中声明的组件

Question

我很难让模块在Angular 2中工作.我已经创建了一个演示问题的插件.在插件中,你会看到我有app.module.该模块导入app-common.module,其中包含一个显示页眉的组件.顶级组件的模板app.component包含此组件的选择器.这是app.common.module:

@NgModule({
imports:[CommonModule, FormsModule],
declarations: [PageHeaderComponent]
})
export class AppCommonModule { }

这是app.module:

@NgModule({
imports:      [AppCommonModule, BrowserModule],
declarations: [AppComponent ],
bootstrap:    [ AppComponent ]
})
export class AppModule { }

运行应用程序时,它会抛出一个错误,"ref-pageheader"不是已知元素.如果我在app.module中声明组件,它可以正常工作.那么,为什么我不能在导入到主app.module的模块中声明这个组件？看来Angular在完成后无法找到它.我究竟做错了什么？我错过了什么吗？

Answer 1

我想你应该像以下一样导出它:

@NgModule({
    imports:[CommonModule, FormsModule],
    declarations: [PageHeaderComponent],
    exports: [PageHeaderComponent]
})
export class AppCommonModule { } 

这样,其他组件可以使用该组件.

否则PageHeaderComponent只会在里面提供AppCommonModule

也可以看看

• https://angular.io/docs/ts/latest/guide/ngmodule.html#add-the- contactmodule

我们导出ContactComponent,以便导入ContactModule的其他模块可以将其包含在组件模板中.

默认情况下,所有其他声明的联系类都是私有

• https://angular.io/docs/ts/latest/cookbook/ngmodule-faq.html#!#q-what-to-export

导出其他模块中的组件应该能够在其模板中引用的可声明类.这些是你的公共课程.如果不导出类,则它保持私有,仅对此模块中声明的其他组件可见.