前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Angular Feature Modules

Angular Feature Modules

作者头像
前端小鑫同学
发布2022-12-26 08:38:24
4730
发布2022-12-26 08:38:24
举报
文章被收录于专栏:小鑫同学编程历险记

theme: smartblue

Angular Feature Modules

创建FModule:

ng generate module <module-name>

输出内容:

代码语言:javascript
复制
app/
    <module-name>/
        <module-name>.module.ts
代码语言:javascript
复制
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';



@NgModule({
  declarations: [],
  imports: [
    CommonModule
  ]
})
export class Module01Module { }

输出内容说明:

  1. NgModule的用法和作用跟组件中的一致为了使用@NgModule装饰器来对Module类进行装饰.
  2. CommonModule的作用是提供了常用的指令如:ngIf,ngFor等.
将FModule导入AppModule
代码语言:javascript
复制
@NgModule({
  imports: [
    Module01Module, // 添加FModule
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }
渲染FModule的组件模板

为FModule模块增加组件 ng generate component <module-name>/<ComponentName>

受Angular模块化的限制,在非A模块去使用A模块中的组件的情况,需要在A模块中进行导出。修改后的module01模块如下:

代码语言:javascript
复制
@NgModule({
declarations: [
 Comp1Component
],
imports: [
 CommonModule
],
exports: [
 Comp1Component, // 导出组件
]
})
export class Module01Module { }
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-08-11,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • theme: smartblue
    • Angular Feature Modules
      • 创建FModule:
      • 将FModule导入AppModule
      • 渲染FModule的组件模板
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档