ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

HoRain云--AngularJS 表达式

HoRain云--AngularJS 表达式 AngularJS 使用表达式把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内{{ expression }}。AngularJS 表达式把数据绑定到 HTML这与ng-bind指令有异曲同工之妙。AngularJS 将在表达式书写的位置输出数据。AngularJS 表达式很像JavaScript 表达式它们可以包含文字、运算符和变量。实例 {{ 5 5 }} 或 {{ firstName lastName }}AngularJS 实例!DOCTYPE html html head meta charsetutf-8 script srchttp://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js/script /head body div ng-app p我的第一个表达式: {{ 5 5 }}/p /div /body /html尝试一下 »AngularJS 数字AngularJS 数字就像 JavaScript 数字AngularJS 实例div ng-app ng-initquantity1;cost5 p总价 {{ quantity * cost }}/p /div尝试一下 »使用 ng-bind 的相同实例AngularJS 实例div ng-app ng-initquantity1;cost5 p总价 span ng-bindquantity * cost/span/p /div尝试一下 »使用ng-init不是很常见。您将在控制器一章中学习到一个更好的初始化数据的方式。AngularJS 字符串AngularJS 字符串就像 JavaScript 字符串AngularJS 实例div ng-app ng-initfirstNameJohn;lastNameDoe p姓名 {{ firstName lastName }}/p /div尝试一下 »使用 ng-bind 的相同实例AngularJS 实例div ng-app ng-initfirstNameJohn;lastNameDoe p姓名 span ng-bindfirstName lastName/span/p /div尝试一下 »AngularJS 对象AngularJS 对象就像 JavaScript 对象AngularJS 实例div ng-app ng-initperson{firstName:John,lastName:Doe} p姓为 {{ person.lastName }}/p /div尝试一下 »使用 ng-bind 的相同实例AngularJS 实例div ng-app ng-initperson{firstName:John,lastName:Doe} p姓为 span ng-bindperson.lastName/span/p /div尝试一下 »AngularJS 数组AngularJS 数组就像 JavaScript 数组AngularJS 实例div ng-app ng-initpoints[1,15,19,2,40] p第三个值为 {{ points[2] }}/p /div尝试一下 »使用 ng-bind 的相同实例AngularJS 实例div ng-app ng-initpoints[1,15,19,2,40] p第三个值为 span ng-bindpoints[2]/span/p /div尝试一下 »AngularJS 表达式 与 JavaScript 表达式类似于 JavaScript 表达式AngularJS 表达式可以包含字母操作符变量。与 JavaScript 表达式不同AngularJS 表达式可以写在 HTML 中。与 JavaScript 表达式不同AngularJS 表达式不支持条件判断循环及异常。与 JavaScript 表达式不同AngularJS 表达式支持过滤器。
返回列表