Angular4 Ng 模块
原文地址 http://www.jianshu.com/p/317f0e4b7284
根模块 (root module)
每个应用都至少有一个根模块用来引导并运行应用。根模块通常命名为 AppModule
。
示例 src/app/app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
@NgModule({
imports: [ BrowserModule ],
declarations: [ AppComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
imports 数组
注意:不要在
imports
数组中加入NgModule
类型之外的类。
如果有两个同名指令都叫做 HighlightDirective
,我们只要在 import
时使用 as
关键字来为第二个指令创建个别名就可以了。
import {
HighlightDirective as ContactHighlightDirective
} from './contact/highlight.directive';
关于 BrowserModule
每个浏览器中运行的应用都需要 @angular/platform-browser
里的 BrowserModule
。 所以每个这样的应用都在其根 AppModule
的 imports
数组中包含 BrowserModule
。
NgIf
是在来自 @angular/common
的 CommonModule
中声明的。CommonModule
提供了很多应用程序中常用的指令,包括 NgIf
和 NgFor
等。BrowserModule
导入了 CommonModule
并且重新导出了它。 最终的效果是:只要导入 BrowserModule
就自动获得了 CommonModule
中的指令。
declarations 数组
你必须在一个 NgModule
类声明每一个组件,否则浏览器控制台会报错。(好像不对啊)
不要在
declarations
添加组件、指令和管道以外的其他类型。
不要把 NgModel
(或 FORMS_DIRECTIVES
)加到 AppModule
元数据的 declarations
数据中!这些指令属于 FormsModule
。
组件、指令和管道只能属于一个模块。
永远不要再次声明属于其它模块的类。
bootstrap 数组
通过引导根 AppModule
来启动应用。 在启动过程中,其中一步是创建列在 bootstrap
数组的组件, 并将它们每一个都插入到浏览器的DOM中。
每个被引导的组件都是它自己的组件树的根。 插入一个被引导的组件通常触发一系列组件的创建并形成组件树。
虽然可以将多个组件树插入到宿主页面,但并不普遍。 大多数应用只有一个组件树,它们引导单一根组件。
Ng模块 (NgModule)
特性模块
特性模块是带有 @NgModule
装饰器及其元数据的类,就像根模块一样。 特性模块的元数据和根模块的元数据的属性是一样的。
根模块和特性模块还共享着相同的执行环境。 它们共享着同一个依赖注入器,这意味着某个模块中定义的服务在所有模块中也都能用。
它们在技术上有两个显著的不同点:
- 我们引导根模块来启动应用,但导入特性模块来扩展应用。
- 特性模块可以对其它模块暴露或隐藏自己的实现。
特性模块用来提供了内聚的功能集合。 聚焦于应用的某个业务领域、用户工作流、某个基础设施(表单、HTTP、路由),或一组相关的工具集合。
虽然这些都能在根模块中做,但特性模块可以帮助我们把应用切分成具有特定关注点和目标的不同区域。
当前模块不会继承其它模块中对组件、指令或管道的访问权。根模块与特性模块的
imports
互不相干。如果某一个模块要绑定到[(ngModel)]
就必需导入FormsModule
。
Angular4 Ng 模块的更多相关文章
- [转]【Angular4】基础(六):HTTP模块
本文转自:https://blog.csdn.net/u013451157/article/details/79519719 版权声明:本文为博主原创文章,未经博主允许不得转载. https://bl ...
- 《Angular4从入门到实战》学习笔记
<Angular4从入门到实战>学习笔记 腾讯课堂:米斯特吴 视频讲座 二〇一九年二月十三日星期三14时14分 What Is Angular?(简介) 前端最流行的主流JavaScrip ...
- 03、AngularJs的模块与控制器
大部分的应用程序都有一个主方法(main)来组织,实例化,启动应用程序.而AngularJs应用是没有主方法的,它是通过模块来声明应用应该如何启动的.同时,模块允许声明来描述应用中依赖关系,以及如何进 ...
- 4.了解AngularJS模块和依赖注入
1.模块和依赖注入概述 1.了解模块 AngularJS模块是一种容器,把代码隔离并组织成简洁,整齐,可复用的块. 模块本身不提供直接的功能:包含其他提供功能的对象的实例:控制器,过滤器,服务,动画 ...
- angular2 学习笔记 ( ngModule 模块 )
2016-08-25, 当前版本是 RC 5. 参考 : https://angular.cn/docs/ts/latest/guide/ngmodule.html 提醒 : 这系列笔记的 " ...
- 7_nodejs angularjs
webstrom使用: ctrl+b/点击,代码导航,自动跳转到定义 ctrl+n跳转指定类 ctrl+d复制当前行ctrl+enter另起一行ctrl+y删除当前行 ctrl+alt/shift+b ...
- Centos 6.5 部署 redmine 3.3
验证ruby版本 如果有就卸载安装最新的 yum install gcc* openssl openssl-devel -y wget https://ruby.taobao.org/mirrors/ ...
- 我的angularjs源码学习之旅1——初识angularjs
angular诞生有好几年光景了,有Google公司的支持版本更新还是比较快,从一开始就是一个热门技术,但是本人近期才开始接触到.只能感慨自己学习起点有点晚了.只能是加倍努力赶上技术前线. 因为有分析 ...
- 使用AngularJS实现简单:全选和取消全选功能
这里用到AngularJS四大特性之二----双向数据绑定 注意:没写一行DOM代码!这就是ng的优点,bootstrap.css为了布局,JS代码也只是简单创建ng模块和ng控制器 效果: < ...
随机推荐
- JPA+Hibernate 3.3 ——增删改查
1. 查找对象 1) 用find()方法查找对象 public void getPerson(){ EntityManagerFactory factory = Persistence. ...
- Unity实现混合模式的ADD模式
一般来说,2D的特效都会用到ADD模式来播放,但是Unity居然没有内置任何的混合模式,网上资料太少,没有写好的Shader,这里提供下我自己编写Shader: Shader "Unlit/ ...
- 常用七种排序的python实现
1 算法复杂度 算法复杂度分为时间复杂度和空间复杂度.其中, 时间复杂度是指执行算法所需要的计算工作量:而空间复杂度是指执行这个算法所需要的内存空间. 算法的复杂性体现在运行该算法时的计算机所需资源的 ...
- Unity和Android混合开发
通用的流程 https://blog.csdn.net/zhangdi2017/article/details/65629589 应用场景 Unity游戏中一些功能需要安卓系统的支持,如搜索wifi等 ...
- hdoj:2035
#include <iostream> using namespace std; int main() { long a, b; && b != ) { long resu ...
- 新的时代:今日三款新IM正式宣战微信!
今天(2019年1月5日)是社交圈的大日子,在今天上午将有三款不同的社交软件进行发布会,王欣.张一鸣.罗永浩旗下公司三款社交产品于今日同日发布. 新的时代,共同挑战微信 2019年1月15日,张一鸣的 ...
- python风格的抽象工厂模式
抽象工厂模式: 提供一个接口,用户创建多个相关或依赖对象,而不需要指定具体类. 原则: 依赖抽象,不依赖具体类. 实例: 用不同原材料制作不同口味的披萨,创建不同原材料的工厂,不同实体店做出口味不同的 ...
- IDEA 最新版破解教程图解
一.打开此网站 http://idea.lanyus.com 并下载红色框框内的包 二.拷贝到idea 安装目录bin文件下 三.编辑 idea64.exe.vmoptions 和 idea.exe. ...
- myeclipse创建hibernate工程
1.创建数据库: from blog http://www.cnblogs.com/zhaocundang/p/9061959.html 使用navicat mysql IDE: 创建数据库 book ...
- Android中Sqlite数据库多线程并发问题
最近在做一个Android项目, 为了改善用户体验,把原先必须让用户“等待”的过程改成在新线程中异步执行.但是这样做遇到了多个线程同时需要写Sqlite数据库,导致操作数据库失败. 本人对Java并不 ...