angular2学习 之 组件

1. 生命周期

Constructor:构造器初始化

OnChanges:触发数据变化钩子

OnInit:组件初始化(处理业务逻辑)

OnChanges:运行期间触发数据变化钩子(n多次触发)

OnDestroy:组件销毁前(数据清理,如事件解绑)

2. 模板

import { Component } from '@angular/core';//装饰器 赋予一个类丰富的信息(元数据)@Component({  //元数据  selector: 'app-root',//css3选择器 //template:'<p>内联模板</p>',  templateUrl: './app.component.html',//外联模板  styleUrls: ['./app.component.css']})//组件类export class AppComponent {  title = '123';}

3.数据绑定

插值:{{}}

属性绑定:[]

事件绑定:()响应由绑定目标（如HTML元素、组件或指令）触发的事件

双向绑定:[()]

父组件向子组件传递数据

父组件中子组件标签引入数据

<contact [data]="item" ></contact>

子组件组件类中引入

export class Contact{@Input() data:IContact;}

angular在数据流动上,没有提供原生的双向绑定,angular推崇单向数据绑定