Angular的双向数据绑定,个人认为是指如果通过model建立了一个数据模型,视图上的数据会相应的存储在angular程序中,视图上的数据变化会和model同步,model的数据变化也会和视图同步。
以下演示演示演示了:
!DOCTYPE html html lang=' en ' head meta charset=' UTF-8 ' title hello,AngularJS!/title script src=' http : angular . js '/script/head body div ng-app!- ng-model指令将表单的值绑定到模型的用户名变量-输入ng-model=' username ' type=' text ' placeholder='请输入.p您好,strong { {用户名}}/strong!/p /div/body/html运行结果:程序运行后,在输入框中输入文本,以下内容与输入框内容同步变化。是不是很神奇!以前,需要编写一大段js代码(侦听onchange事件,并将输入值赋给下面的强元素),但现在只需一条ng-model指令就可以完成。Perferct!
详细案例说明:
1.ng-model指令的作用:建立一个数据模型,其中有一个变量username来存储值;输入元素的;
2.{{username}}是一个表达式,angular会自动计算并替换为相应的值。
3.手动输入文本,输入元素的值会改变,并自动同步到模型的usename变量。{{username}}从模型中读取username的值,因此以下强元素的内容会相应地改变。
Angular帮助我们同步了数据。
感谢您的阅读,希望对大家有所帮助,感谢您对本网站的支持!