元素：组件，元数据，模板，数据绑定，服务，指令，模块
header
contaclist：contact，contactApp
footer
组件js +html +css
定义输入输出
全生命周期支持
constructor构造器初始化
onChanges第一次触发数据变化勾子
onInit初始化
onChanges运行期间触发数据变化勾子
onDestroy组件销毁前
@Component({//装饰器：赋予一个类更丰富的信息（元数据）
selector:'hello' ,//元数据找标签:
template:'{{greeting}}' //模板string或url路径
})
export class HelloComponet{ //组件类
privategreeting:string;
constructor(){
this.greeting='hello,Angular2!';
}
}
属性绑定：[value]
//单向
//单向
事件绑定：（keyup）
//单向
双向绑定：[(ngModel)]
//双向
组件是指令的一种：
指令：属性指令：改变模板的外观或者行为，如样式等
结构指令：改变组件模板的Dom结构，如ngif用来插件入或者移除Dom结点
@Directive({
selector:'[highlight]'
})
export class HighlightDirective{
constructor(el:ElementRef,renderer:Renderer){
render.setElementStyle(el.nativeElement,'backgroundColor','yellow')
}
}
服务：是实现专一目的的逻辑单元，如日志服务
export class LoggerService{
constructor(){}
debug(msg:string){
console.log(msg)
}
error(msg:string){
console.error(msg);
}
}
依赖注入
providers:[LoggerService]
constructor:(logger:LoggerService)
分层注入
根组件注入LoggerService（单例）子组件也有注入
在子组件重新注入：组件及子组件也是分层注入
模块：
模块有两层含义
框架代码以模块形式组织（文件模块）关注代码层面
功能单元以模块形式组织（应用模块）关注应用层面
import{Http} from "@angular/http" //导入模块
//@Component装饰器
import {Component} from "@angular/core"
// @Directive装饰器
import {Directive} from "@angular/core"
import {ElementRef,Renderer} from"@angular/core"
应用模块
模块A:组件服务指令
模块B:组件服务指令
模块C:组件服务指令
