关于module

在angular中有一个核心module叫app.module，但是如果我们把所有的东西都放在app.module里面就不好维护，所以我们可以建立多个module来管理不同的模块

例如，我们可以建立一个share.module来管理所有的公共模块，然后再app.module中导入share.module即可

PS:一定记得，如果要在别的模块引入share.module里面的模块，在share.module模块中记得要导出,不然别的模块是引用不到的

app.module

import { HttpClient, HttpClientModule, HTTP_INTERCEPTORS } from 
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { SharedModule } from './shared/shared.module';


@NgModule({
   imports: [
    HttpClientModule,
    SharedModule,
    })
  ],
  declarations: [
    AppComponent,
   ],
  //the service providers(各种服务提供商)
  providers: [ 
    CookieService,
    HttpService
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

SharedModule:比如我们在share.module中引入了chartmodule

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { ChartModule } from '@syncfusion/ej2-angular-charts';




@NgModule({
  imports: [
    ChartModule
  ],
  exports: [
    ChartModule  //一定记得要导出
  ],
  declarations: [
    DialogComponent
  ]
  providers:[
    { provide: PERFECT_SCROLLBAR_CONfig, useValue: DEFAULT_PERFECT_SCROLLBAR_CONfig }
  ]
})
export class SharedModule { }

详细步骤：

appmodule

1、新建core module

ng g m core

core.module.ts:将一些基础类module都存入到coremodule，比如browserModule、approutingmodule、httpclientmodule、browseranimationsmodule等等

将后面创建的sharemodule、servicemodule、pagesmodule都引入到coremodule中去

然后在在appmodule中引入import coremodule

ps：将approutingModule放在最后面引入

2、新建share module

ng g m share

share.module.ts将全局都会用到的公共组件、指令都存入到sharemodule，比如formmodule，chartmodule等，记得一定要导出

然后再在appmodule中引入import sharemodule

3、新建pages module //记得在pages module中引入share.module，这样就不需要在每个页面再单独的引用

ng g m pages

page.module.ts管理所有的页面模块，将所有页面模块都集中管理再pages module中

4、新建服务模块 services module

ng g m services

存放服务，主要包括http服务

然后再在coremodule中引入services module

------------恢复内容结束------------

相关推荐