Angular Feature Modules
Angular Feature modules
2023-06-13 09:16:12 时间
theme: smartblue
Angular Feature Modules
创建FModule:
ng generate module <module-name>
输出内容:
app/
<module-name>/
<module-name>.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
@NgModule({
declarations: [],
imports: [
CommonModule
]
})
export class Module01Module { }
输出内容说明:
- NgModule的用法和作用跟组件中的一致为了使用@NgModule装饰器来对Module类进行装饰.
- CommonModule的作用是提供了常用的指令如:ngIf,ngFor等.
将FModule导入AppModule
@NgModule({
imports: [
Module01Module, // 添加FModule
],
bootstrap: [AppComponent]
})
export class AppModule { }
渲染FModule的组件模板
为FModule模块增加组件 ng generate component <module-name>/<ComponentName>
受Angular模块化的限制,在非A模块去使用A模块中的组件的情况,需要在A模块中进行导出。修改后的module01模块如下:
@NgModule({
declarations: [
Comp1Component
],
imports: [
CommonModule
],
exports: [
Comp1Component, // 导出组件
]
})
export class Module01Module { }
相关文章
- 一个 Angular 开发人员对腾讯 Cloud Studio 使用后的体验报告
- Angular HTTP 请求自定义 timeout 值的一种实现思路
- angular入门教程_初学者织围巾简单教程慢动作
- 关于 Angular 应用的入口
- 使用 Angular Universal 进行服务器端渲染避免 window is not defined 的错误消息
- Angular Universal 应用避免 SSR hang 的一些指导方针
- Angular RouterModule.forRoot(ROUTES) 和 forChild(ROUTES)的区别
- 关于 Angular 工程文件 angular.json 里的 inlineCritical 属性
- Angular SSR 应用启动时的一些保护措施
- 基于 Spartacus 的 Angular Storefront 性能优化建议
- Angular 项目中 angular.json builder 字段的可选项介绍
- 关于 Angular 12 的 inlineCriticalCss 选项
- angular.element方法汇总