详解Angular中的NgModule(模块)


本文摘自PHP中文网,作者青灯夜游,侵删。

本篇文章带大家详细了解一下Angular中的NgModule(模块)。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

Angular 模块(NgModule)

  • Angular 应用是模块化的, 它拥有自己的模块化系统, 称作 NgModule。 一个 NgModule 就是一个容器, 用于存放一些内聚的代码块, 这些代码块专注于某个应用领域、 某个工作流或一组紧密相关的功能。 它可以包含一些组件、 服务提供商或其它代码文件, 其作用域由包含它们的 NgModule 定义。 它还可以导入一些由其它模块中导出的功能, 并导出一些指定的功能供其它 NgModule 使用。
  • 一个模块也是一个带有 @NgModule 装饰器的 TypeScript 类。

相关教程推荐:《angular教程》

NgModule 元数据

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

import { BrowserModule } from '@angular/platform-browser';

import { NgModule } from '@angular/core';

import { FormsModule } from '@angular/forms';

import {HttpClient, HttpClientModule} from '@angular/common/http';

 

import { AppComponent } from './app.component';

 

@NgModule({

  declarations: [

    AppComponent,

  ],

  imports: [

    BrowserModule,

    FormsModule,

    HttpClientModule,

  ],

  providers: [],

  bootstrap: [AppComponent]

})

export class AppModule { }

  • declarations

声明模块有什么东西, 只能声明组件、 指令和管道。

  • imports

导入表, 声明了要让应用运转所依赖的一些模块。

  • providers

声明模块中提供了哪些服务, 只能声明服务。

  • bootstrap

声明模块的主组件是什么。 只有根模块才应该设置这个 bootstrap 属性。

更多编程相关知识,请访问:编程教学!!

阅读剩余部分

相关阅读 >>

谈谈Angular模块的使用以及懒加载

Angular cli是什么以及如何安装

解决Angular中的浏览器兼容性问题的方法介绍

Angular和vue.js的区别是什么?Angular和vue.js的深度对比

浅谈Angular如何使用ng-content进行内容投影

浅谈Angular中组件样式的工作原理

浅谈Angular中@、=、&指令的差异

浅谈Angular中http请求模块的用法

深入了解Angular组件中的生命周期钩子

Angular cli中的在线和离线安装

更多相关阅读请进入《Angular》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...