Question

我的Angular2 RC6应用程序有两个模块，我不知道如何声明共享组件。

我有一个名为spinnerComponent的组件，它在整个应用程序中使用。我在app.modules.as中定义了它：

@NgModule({
    imports: [BrowserModule, routing,RepairReturnModule],
    providers: [ ],
    declarations: [AppComponent,SpinnerComponent],
    bootstrap: [AppComponent]
})

然后在RepairreturnModule中我再次将其定义为：

@NgModule({
    imports: [CommonModule],
    declarations: [
        SpinnerComponent
    ],
    providers: []
})

正如所料，我得到：

类型SpinnerComponent是2个模块的声明的一部分： RepairReturnModule和AppModule

我从RepairreturnModule中的声明中删除了SpinnerComponent，然后我得到了：

未处理的Promise拒绝：模板解析错误：无法绑定＆＃39; isRunning＆＃39;因为它不是“旋转器 - 组件”的已知属性。 1.如果＆＃39; spinner-component＆＃39;是一个Angular组件，它有＆＃39; isRunning＆＃39;输入，然后验证它是否是该模块的一部分。 2.如果＆＃39; spinner-component＆＃39;是一个Web组件，然后添加＆＃34; CUSTOM_ELEMENTS_SCHEMA＆＃34;到＆＃39; @ NgModule.schema＆＃39;这个组件压制此消息。 ......表示没有宣布。

我错过了什么？

Answer 1

将exports: [SpinnerComponent]添加到app.modules NgModules装饰器中。

参考：https://angular.io/docs/ts/latest/guide/architecture.html，

``` NgModule是一个装饰器函数，它接受一个属性描述模块的元数据对象。最重要的属性是：

...

exports - 在其他模块的组件模板中应该可见和可用的声明子集。

...

```

Answer 2

您也可以将SpinnerComponent保留在RepairReturnModule中，因为这个是在主App模块中导入的，但也将它添加到模块的“exports”数组中。在此之后，只需从App模块的声明中删除它。

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

Answer 3

看到完整的代码将是有益的，但无论如何......

您可以尝试将微调器移回修复模块，然后从应用程序模块中将其导入。我使用单独的（在你的情况下它将是第三个）'共享'模块，其中共同的功能坐在这里，所以每个其他模块可以从那里导入它。

Angular2组件在多个模块中声明

3 个答案: