宝哥软件园

AngularJS入门教程的数据绑定用法示例

编辑:宝哥软件园 来源:互联网 时间:2021-09-13

本文说明了AngularJS数据绑定的用法。分享给大家参考,如下:

数据绑定是AngularJS中一个非常重要的特性。让我们看看下面的例子:

!DOCTYPE html html ng-app head lang=' en ' meta charset=' UTF-8 '脚本类型=' text/JavaScript ' src=' http : angular-1 . 3 . 0 . 14/angular . js '/脚本标题教程02/title/head dydiv用户名:输入类型=' text' ng-model=' name '占位符=' user name'/Password:输入类型=' password' ng-model=' pword '占位符=' password'/p您输入的用户名:{ }

当我们在文本框中输入信息时,我们输入的信息将被动态回显到页面。

在本例中,我们使用了AngularJs的另一个内置指令ng-model,这意味着我们在模型数据对象($scope)中添加了一个名为“name”的属性,并将其绑定到文本框对象。这意味着我们在文本框中输入的任何内容都将同步到这个“名称”属性,而AngularJs将监听表单对象的相关事件,因此echo内容将随着文本框的输入而改变。

需要注意的是,ng-model只能在表单元素标签中使用。

AngularJS源代码可以在这里下载。

希望本文对AngularJS编程有所帮助。

更多资讯
游戏推荐
更多+