angular2
Angular2
1. Angular2简介
Angular2简称Angular，作为Angular.js1.x的升级，其表现了以下四点优势：
a. 改用组件式开发；
b. 性能更好（渲染更快、变化监测效率更高）；
c. 优先为移动应用设计；
d. 更加贴合未来标准（es6/es7，WebComponent）。
2. 开发环境：
a. Node.js;
b. Typescript:是JavaScript的一个超集，在es6的基础上做了进一步增强，主要有类型校验（Type+JavaScript，如privategreeting: string;）、接口（interface，如interfaceFullName{}）、装饰器（@符号紧接一个函数名称，如@Component）等特性。这使得代码编写更规范有利于项目开发。
c. 编码工具：
VS Code（微软推荐、TypeScript集成度最强）、Webstorm、Sublime、Atom
d. 打包工具
Webpack/gulp
3. Angular的组织架构
① package.json：Angular一系列基础的依赖包；
② node_modules：npminstall 会根据package.json配置文件安装所有的依赖包；
③ tsconfig.json：配置了Typescript编译器的配置文件；
④ src 4.1 app.component.ts
4.2 app.component.html
4.3 app.module.ts
4.4 main.ts 入口文件，通过这个文件串联整个项目
调用platformBrowserDynamic().bootstrapModule()方法来编译启动AppModule模块。
4. Angular的八大核心概念
组件 模板 元数据 ； 数据绑定 ； 指令 ； 服务 依赖注入 ； 模块
4．1组件/模板/元数据
组件是构成Angular应用的基础单元，
组件主由三大部分构成
a. 导入部分（ import ）
要定义一个组件，我们总是要先导入符号Component
b. 装饰器（@Component）
赋予一个类更丰富的信息（元数据）
c. 组件类（export class AppComponent）
组件业务逻辑
组件——生命周期钩子
ngOnInit：用于数据绑定输入属性之后初始化组件；
ngOnChanges：用于响应组件输入值发生变化时触发的事件；
ngOnDestroy：在销毁指令/组件之前触发。
其他：ngDoCheck、ngAfterContentInit、ngAfterContentChecked、ngAfterViewInit、ngAfterViewChecked
组件渲染：selector是一个css3选择器，当程序运行时，匹配到html中的hello标签；当组件逻辑执行完之后，p标签嵌入到hello标签里，而模板里的变量也会替换成具体的值。
模板：
内联模板：template
外联模板：templateUrl
子组件获取父组件的数据，通过属性绑定
父组件获取子组件的数据，通过事件绑定，子组件发送。
4.2 数据绑定
4.2.1 插值
{{ }}
可直接使用组件类里的成员变量
4.2.2 属性绑定——单向
把组件类的数据传递到组件模板上
<input [value] = “data” />
4.2.3 事件绑定——单向
把模板里产生的数据通过函数调用的方式传递到组件类
<input (keyup) = “handle($event)” />
4.2.4 双向绑定
<input [(NgModule)] = “myData” />
实现数据双向流动
4.3 指令
4.3.1属性指令
改变组件模板的外观或者行为，如样式等。
// textColor= “red”
template:“<p [style.color]=“textColor”> hello, ng2! </p> ”
<p style=“ color: red ”> hello, ng2! </p>
4.3.2结构指令
改变组件模板的DOM结构，如ngIf用来插入或者移除DOM节点。
template:“<p ngIf=“textColor”> hello, ng2! </p> ”
当组件类中textColor存在是，DOM中存在此p标签
4.4 服务、依赖注入
服务是实现专一目的的逻辑单元，如日志服务
服务被组件使用需要引入依赖注入
组件引入服务实际引用的是服务类的实例，所以服务在被引入之前会有一个实例化的过程，并且这个实例通常需要被缓存起来，以被其它组件使用
因此管理实例化和实例缓存的过程正是依赖注入机制所实现的
4.5 模块
4.5.1文件模块
框架代码以模块形式组织。
4.5.2应用模块
功能单元以模块形式组织。
exports 可以将某些对象声明为公开的。