Angular4的dom事件

• 差值表达式和属性绑定其实是一样的（例）

<!-- 这两个是一样的效果，使用哪个都可以 -->

<img src="{{imgUrl}}">

<img [src]="imgUrl">

• dom属性和html属性不一样

<input value="请输入姓名" (input)="change($event)">

change(event) {

  // dom属性

  console.log(event.target.value);

  // html属性

  console.log(event.target.getAttribute('value'));

}

// 打印结果

consult.component.ts:24 请输入姓

consult.component.ts:25 请输入姓名

consult.component.ts:24 请输入

consult.component.ts:25 请输入姓名

consult.component.ts:24 请输

consult.component.ts:25 请输入姓名

总结：

1：随着我不断的删除一些字，dom属性一直在变化，然而html属性并没变化。dom属性代表当前的值，html属性代表的是初始的值。

2：dom属性的值可以改变，html属性的值不能改变。

3：angular模板绑定是通过dom属性和事件来工作的，而不是html属性。