AngularJS表达式讲解及示例代码


Posted in Javascript onAugust 16, 2016

表达式用于应用程序数据绑定到HTML。表达式都写在双括号就像{{表达式}}。表达式中的行为跟ng-bind指令方式相同。 AngularJS应用表达式是纯javascript表达式,并输出它们被使用的数据在那里。

使用数字

<p>Expense on Books : {{cost * quantity}} Rs</p>

使用字符串

<p>Hello {{student.firstname + " " + student.lastname}}!</p>

使用对象

<p>Roll No: {{student.rollno}}</p>

使用数组

<p>Marks(Math): {{marks[3]}}</p>

例子

下面的例子将展示上述所有表达式。

testAngularJS.html 文件代码如下:

<html>
<title>AngularJS Expressions</title>
<body>
<h1>Sample Application</h1>
<div ng-app="" ng-init="quantity=1;cost=30; student={firstname:'Mahesh',lastname:'Parashar',rollno:101};marks=[80,90,75,73,60]">
  <p>Hello {{student.firstname + " " + student.lastname}}!</p>  
  <p>Expense on Books : {{cost * quantity}} Rs</p>
  <p>Roll No: {{student.rollno}}</p>
  <p>Marks(Math): {{marks[3]}}</p>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
</body>
</html>

输出

在Web浏览器打开textAngularJS.html。看到结果如下:

AngularJS表达式讲解及示例代码

以上就是对AngularJS 表达式的资料整理,后续继续补充相关资料,谢谢大家对本站的支持!

Javascript 相关文章推荐
js window.onload 加载多个函数的方法
Nov 02 Javascript
jQuery图片预加载 等比缩放实现代码
Oct 04 Javascript
jQuery(js)获取文字宽度(显示长度)示例代码
Dec 31 Javascript
flash遮住div问题的正确解决方法
Feb 27 Javascript
JS访问SWF的函数用法实例
Jul 01 Javascript
使用JQuery选择HTML遍历函数的方法
Sep 17 Javascript
微信公众平台开发教程(五)详解自定义菜单
Dec 02 Javascript
Vue.js教程之axios与网络传输的学习实践
Apr 29 Javascript
Vue+Vux项目实践完整代码
Nov 30 Javascript
微信小程序--获取用户地理位置名称(无须用户授权)的方法
Apr 29 Javascript
Flutter实现仿微信底部菜单栏功能
Sep 18 Javascript
addEventListener()和removeEventListener()追加事件和删除追加事件
Dec 04 Javascript
谈谈PHP中相对路径的问题与绝对路径的使用
Aug 16 #Javascript
jQuery多文件异步上传带进度条实例代码
Aug 16 #Javascript
AngularJS指令详解及示例代码
Aug 16 #Javascript
AngularJS教程之简单应用程序示例
Aug 16 #Javascript
AngularJS教程之MVC体系结构详解
Aug 16 #Javascript
超实用的javascript时间处理总结
Aug 16 #Javascript
AngularJS教程之环境设置
Aug 16 #Javascript
You might like
关于查看MSSQL 数据库 用户每个表 占用的空间大小
2013/06/21 PHP
php中的字符编码转换函数用法示例
2014/10/20 PHP
php通过exif_read_data函数获取图片的exif信息
2015/05/21 PHP
php基于session实现数据库交互的类实例
2015/08/03 PHP
YII分模块加载路由的实现方法
2018/10/01 PHP
php进行md5加密简单实例方法
2019/09/19 PHP
用jquery写的一个万年历(自写)
2014/01/20 Javascript
JavaScript 2048 游戏实例代码(简单易懂)
2016/03/25 Javascript
javascript运算符——位运算符全面介绍
2016/07/14 Javascript
javascript 判断是否是微信浏览器的方法
2016/10/09 Javascript
Angular2开发——组件规划篇
2017/03/28 Javascript
Bootstrap datepicker日期选择器插件使用详解
2017/07/26 Javascript
JS获取字符对应的ASCII码实例
2017/09/10 Javascript
vue获取元素宽、高、距离左边距离,右,上距离等还有XY坐标轴的方法
2018/09/05 Javascript
JS实现的字符串数组去重功能小结
2019/06/17 Javascript
在antd4.0中Form使用initialValue操作
2020/11/02 Javascript
python基础教程之udp端口扫描
2014/02/10 Python
Python实现全局变量的两个解决方法
2014/07/03 Python
用python删除java文件头上版权信息的方法
2014/07/31 Python
Python中文件操作简明介绍
2015/04/13 Python
python写入中英文字符串到文件的方法
2015/05/06 Python
Python使用PIL模块生成随机验证码
2017/11/21 Python
python模仿网页版微信发送消息功能
2018/02/24 Python
Python3删除排序数组中重复项的方法分析
2019/01/31 Python
Python使用reportlab模块生成PDF格式的文档
2019/03/11 Python
Falsk 与 Django 过滤器的使用与区别详解
2019/06/04 Python
python-tkinter之按钮的使用,开关方法
2019/06/11 Python
python 实现在一张图中绘制一个小的子图方法
2019/07/07 Python
PyTorch加载预训练模型实例(pretrained)
2020/01/17 Python
在tensorflow中实现去除不足一个batch的数据
2020/01/20 Python
使用Python实现批量ping操作方法
2020/05/06 Python
基于Python把网站域名解析成ip地址
2020/05/25 Python
Hotels.com韩国:海外国内旅行所需的酒店和住宿预订网站
2020/05/08 全球购物
国际金融专业大学生职业生涯规划书
2013/12/28 职场文书
央视元宵晚会主持串词
2014/03/25 职场文书
详解CSS中的特指度和层叠问题
2021/07/15 HTML / CSS