如何在Angular2中为多个模块创建包装模块？

问题描述：

我目前正试图清理我的项目结构，并且希望尽可能保持我的AppComponent清洁。我进口angular2材料在它自己的文件：如何在Angular2中为多个模块创建包装模块？

const APP_PROVIDERS = [ 
    ...MATERIAL_UI_REGISTRIES 
]; 

const APP_MODULES = [ 
    ...MATERIAL_UI_MODULES, 
]; 

@NgModule({ 
    imports:APP_MODULES, 
    declarations: APP_DECLARATIONS, 
    bootstrap:[AppComponent], 
    providers: APP_PROVIDERS, 
}) 
export class AppModule { 

}

但有一种方法来创建一个MaterialModule，我可以只导入：

import { NgModule } from '@angular/core'; 

// Material 
import { MdCardModule } from '@angular2-material/card'; 
import { MdButtonModule } from '@angular2-material/button'; 
import { MdInputModule } from '@angular2-material/input'; 
import { MdToolbarModule } from '@angular2-material/toolbar'; 
import { MdListModule } from '@angular2-material/list'; 
import { MdIconModule, MdIconRegistry } from '@angular2-material/icon'; 

export const MATERIAL_UI_MODULES = [ 
    MdCardModule, 
    MdButtonModule, 
    MdInputModule, 
    MdToolbarModule, 
    MdIconModule, 
    MdListModule 
] 
export const MATERIAL_UI_REGISTRIES = [ 
    MdIconRegistry 
]

和我的AppController里面我如下使用它不必担心添加个别模块或提供者。

我试图创建一个MaterialModule：

@NgModule({ 
    imports:[ 
    ...MATERIAL_UI_MODULES, 
    ], 
    providers: MATERIAL_UI_REGISTRIES, 
}) 
export class MaterialModule { 

}

和进口在我AppComponent：

@NgModule({ 
    imports:[ 
    //...MATERIAL_UI_MODULES, 
    MaterialModule, 
    FormsModule, 
    BrowserModule, 
    routing, 
    ComponentsModule 
    ], 
    declarations: APP_DECLARATIONS, 
    bootstrap:[AppComponent], 
    providers: APP_PROVIDERS, 
}) 
export class AppModule { 

}

但我得到以下错误

zone.js:355 Unhandled Promise rejection: Template parse errors: 
'md-card-title' is not a known element: 
1. If 'md-card-title' is an Angular component, then verify that it is part of this module. 
2. If 'md-card-title' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schema' of this component to 
suppress this message. ("....

你试图询问之前创建MaterialModule？ – micronyks

@micronyks我有，但我得到一个错误（我已更新的问题，包括这个） – jonnie

你知道什么关于'sharedModule'？ – micronyks

答

您可以使用SharedModule 。在SharedModule中声明普通的东西，然后在要使用普通东西的组件中导入SharedModule。

了解更多关于SharedModule这里：https://angular.io/docs/ts/latest/guide/ngmodule.html#!#shared-module

如何在Angular2中为多个模块创建包装模块？

相关推荐