angular4 数据绑定

HTML属性绑定

1.基本Html属性绑定

Html代码 

• <td [attr.colspan]="tableColspan">something</td>  

 2.css类绑定

Html代码 

• <div [class]="someEle">something</div>  

 

Html代码 

• <div class="aaa,bbb" [class.ccc]="isSpec">something</div>  

 

Html代码 

• <div [ngClass]="{aaa:isA,bbb:isB}">something</div>  

 

3.样式绑定

Html代码 

• <button [style.color]="ispec ? 'red' : 'green'">something</button>  

数据绑定

HTML属性和DOM属性的关系

1.少量html属性和DOM属性之间有着1:1的映射，如id

2.有些HTML属性没有对应的DOM属性，如 colspan

3.有些DOM属性没有对应的HTML属性，如 textContent

4.就算名字相同，html属性和DOM属性也不是同样的东西

5.HTML属性的值指定了初始值；DOM属性的值表示当前值。

   DOM属性的值可以改变；HTML属性的值不能改变

6.模板绑定是通过DOM属性和事件来工作的，而不是HTML属性