Angular Module 共享模塊使用 父模塊使用多個子模塊

      Component.module.ts

import {BrowserModule} from '@angular/platform-browser';

import {LocationStrategy, HashLocationStrategy} from '@angular/common';

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

import {FormsModule} from '@angular/forms';

import {HttpClientModule} from '@angular/common/http';

import { HeaderComponent } from './header/header.component';

import { FootComponent } from './foot/foot.component';

import { BodyComponent } from './body/body.component';

@NgModule({

declarations: [

HeaderComponent,

BodyComponent,

FootComponent,

],

imports: [

BrowserModule,

FormsModule,

HttpClientModule,

],

exports:[

HeaderComponent,

BodyComponent,

FootComponent,

]

 

,

providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],

bootstrap: [

]

})

export class ComponentModule {

}

 

 

app.module.ts

 

@NgModule({

declarations: [

AppComponent,

AnalysisComponent,

LoginComponent,

],

imports: [

BrowserModule,

FormsModule,

HttpClientModule,

routing,

//ChartsModule,

DashboardModule,

 

ComponentModule

],

exports:[

],

providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],

bootstrap: [AppComponent]

})

export class AppModule {

}