ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Angular共享特性模块

2020-10-24 08:31:33  阅读:207  来源: 互联网

标签:FormsModule SharedModule 导入 模块 CommonModule import 共享 Angular


创建共享模块能让你更好地组织和梳理代码。你可以把常用的指令、管道和组件放进一个模块中,然后在应用中其它需要这些的地方导入该模块。

想象某个应用有下列模块:

import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { CustomerComponent } from './customer.component';
import { NewItemDirective } from './new-item.directive';
import { OrdersPipe } from './orders.pipe';

@NgModule({
 imports:      [ CommonModule ],
 declarations: [ CustomerComponent, NewItemDirective, OrdersPipe ],
 exports:      [ CustomerComponent, NewItemDirective, OrdersPipe,
                 CommonModule, FormsModule ]
})
export class SharedModule { }

请注意以下几点:

  • 它导入了 CommonModule,因为该模块需要一些常用指令。

  • 它声明并导出了一些工具性的管道、指令和组件类。

  • 它重新导出了 CommonModule 和 FormsModule

通过重新导出 CommonModule 和 FormsModule,任何导入了这个 SharedModule 的其它模块,就都可以访问来自 CommonModule 的 NgIf 和 NgFor 等指令了,也可以绑定到来自 FormsModule 中的 [(ngModel)] 的属性了。

即使 SharedModule 中声明的组件没有绑定过 [(ngModel)],而且 SharedModule 也不需要导入 FormsModule,SharedModule 仍然可以导出 FormsModule,而不必把它列在 imports 中。 这种方式下,你可以让其它模块也能访问 FormsModule,而不用直接在自己的 @NgModule 装饰器中导入它。

标签:FormsModule,SharedModule,导入,模块,CommonModule,import,共享,Angular
来源: https://www.cnblogs.com/varden/p/13867248.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有