Angular 2 构架 - 数据绑定

数据绑定为应用程序提供了一种简单而一致的方法来显示数据以及数据交互，它是管理应用程序里面数值的一种机制

通过这种机制，可以从html里面取值和赋值，使得数据的读写，数据的持久化操作变得更加简单快捷

数据绑定的方法

如下图所示， 数据绑定的语法有四种形式

每种形式都有一个方向——从 dom 来、到 DOM 去、双向，就像图中的箭头所示意的

插值

在 HTML 标签中显示组件值

<h3>
{{title}}
<img src="{{ImageUrl}}">
</h3>

属性绑定

把元素的属性设置为组件中属性的值

<img [src]="userImageUrl">

事件绑定

在组件方法名被点击时触发

<button (click)="onSave()">保存</button>

双向绑

使用 angularJS 里的 NgModel 指令可以更便捷的进行双向绑定

<input [value]="currentUser.firstName" (input)="currentUser.firstName=$event.target.value" >

链接: https://www.fly63.com/course/15_832