首页 > 其他 > 详细

关于module

时间:2020-11-22 13:07:58      阅读:42      评论:0      收藏:0      [点我收藏+]

 

在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

 

 

 

 

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

关于module

原文:https://www.cnblogs.com/jahoon/p/14018735.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!