【04】AngularJS 表达式
AngularJS 表达式
AngularJS 使用 表达式 把数据绑定到 HTML。
AngularJS 表达式
AngularJS 表达式写在双大括号内：{{ expression }}。
AngularJS 表达式把数据绑定到 HTML，这与 ng-bind 指令有异曲同工之妙。
AngularJS 将在表达式书写的位置"输出"数据。
AngularJS 表达式 很像 JavaScript 表达式：它们可以包含文字、运算符和变量。
实例 {{ 5 + 5 }} 或 {{ firstName + " " + lastName }}
<!DOCTYPE html><html><body><div ng-app=""><p>我的第一个表达式：{{5+5}}</p></div><script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script></body></html>
<div class="moyu" ng-app="" ng-init="moyuName='mo'"><input class="ceshi" ng-model ="moyu" type="text"><span ng-bind="moyu"></span><span>{{moyuName}}</span></div>
AngularJS 数字
AngularJS 数字就像 JavaScript 数字：
<div ng-app="" ng-init="quantity=1;cost=5"><p>总价：{{ quantity * cost }}</p></div>
使用 ng-bind 的相同实例：
<div ng-app="" ng-init="quantity=1;cost=5"><p>总价：<span ng-bind="quantity * cost"></span></p></div>
| 使用 ng-init 不是很常见。 |
AngularJS 字符串
AngularJS 字符串就像 JavaScript 字符串：
<div ng-app="" ng-init="firstName='John';lastName='Doe'"><p>姓名：{{ firstName +" "+ lastName }}</p></div>
使用 ng-bind 的相同实例：
<div ng-app="" ng-init="firstName='John';lastName='Doe'"><p>姓名：<span ng-bind="firstName + ' ' + lastName"></span></p></div>
AngularJS 对象
AngularJS 对象就像 JavaScript 对象：
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"><p>姓为{{ person.lastName }}</p></div>
使用 ng-bind 的相同实例：
<div ng-app="" ng-init="person={firstName:'John',lastName:'Doe'}"><p>姓为<span ng-bind="person.lastName"></span></p></div>
AngularJS 数组
AngularJS 数组就像 JavaScript 数组：
<div ng-app="" ng-init="points=[1,15,19,2,40]"><p>第三个值为{{ points[2]}}</p></div>
使用 ng-bind 的相同实例：
<div ng-app="" ng-init="points=[1,15,19,2,40]"><p>第三个值为<span ng-bind="points[2]"></span></p></div>
AngularJS 表达式 与 JavaScript 表达式
类似于 JavaScript 表达式，AngularJS 表达式可以包含字母，操作符，变量。
与 JavaScript 表达式不同，AngularJS 表达式可以写在 HTML 中。（魔芋：通过双括号｛｛｝｝）
与 JavaScript 表达式不同，AngularJS 表达式不支持条件判断，循环及异常。
与 JavaScript 表达式不同，AngularJS 表达式支持过滤器。
【04】AngularJS 表达式的更多相关文章
- AngularJS表达式
1. AngularJS使用表达式把数据绑定到HTML. 2. AngularJS表达式的特点: 表达式写在双大括号内:{{表达式}}. 表达式把数据绑定到HTML,这与ng-bind指令有异曲同工之 ...
- AngularJS开发指南5：AngularJS表达式详解
AngularJS表达式类似Javascript的代码片段,通常在数据绑定中用到,写在双大括号中,如:{{表达式}}.表达式是用$parse方法来处理的. 下面是一些合法的AngularJS表达式 1 ...
- AngularJS学习之旅—AngularJS 表达式(二)
1.AngularJS 表达式 AngularJS 表达式写在双大括号内:{{ expression }}. AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙 ...
- AngularJS 表达式 对象和数组
AngularJS 使用 表达式 把数据绑定到 HTML. AngularJS 表达式 AngularJS 表达式写在双大括号内:{{ expression }}. AngularJS 表达式把数据绑 ...
- angularJS表达式详解！
angularJS的表达式很像Javascript里的表达式:它可以包含文字,运算符和变量: angularJS 表达式: - 数字:{{100+100}} - 字符串:{{‘hello’+'angu ...
- 第一个AngularJS表达式实例
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- 32.AngularJS 表达式
转自:https://www.cnblogs.com/best/tag/Angular/ AngularJS 表达式写在双大括号内:{{ expression }}. AngularJS 表达式把数据 ...
- angularjs表达式中的HTML内容，如何不转义，直接表现为html元素
在模板中直接: 在ionic中直接使用: <p class="contentwen" ng-bind-html="detial.content">& ...
- angularJS表达式和指令
主要是描述angularJS如何扩展html的:(模型后面会涉及) 例子1:通过指令来扩展html <body ng-app="myapp"> <!-- ng ...
随机推荐
- LVS集群体系和调度算法
集群体系和调度算法 LVS集群体系架构 1)使用LVS架设的服务器集群系统有三个部分组成: 最前端的负载均衡层,用Load Balancer表示, 中间的服务器群组层,用Server Array表示, ...
- ssh使用秘钥文件连接提示WARNING: UNPROTECTED PRIVATE KEY FILE!（转载）
转自:http://www.01happy.com/ssh-unprotected-private-key-file/ 在centos 6.4下使用ssh连接远程主机时,用的是另外一个密钥,需要用-i ...
- bzoj 2165: 大楼【Floyd+矩阵乘法+倍增+贪心】
1<<i的结果需要是long long的话i是long long是没用的--要写成1ll<<i--我别是个傻子吧 虽然写的是二进制贪心,但是我觉得二分可能更好写吧(但是会慢) ...
- bzoj [Usaco2010 Hol]cowpol 奶牛政坛【树链剖分】
意识流虚树 首先考虑只有一个党派,那么可以O(n)求树的直径,步骤是随便指定一个根然后找距离根最远点,然后再找距离这个最远点最远的点,那么最远点和距离这个最远点最远的点之间的距离就是直径 那么考虑多党 ...
- mvn 配置
<!-- 阿里云仓库1 --> <mirror> <id>alimaven-1</id> <name>al ...
- Proteus中的 PIC10/12/16 MCUs编译器无法下载的问题
当你打开网站时,点击该软件下载会发现如下页面: google一下会出现这个界面,大意是这个版本的编译器太老了,已经被某些更加高级的编译器给取代了(qaq心痛) 然后我就开始FQ到处google,Sou ...
- java IO流 之 字节输入流 InputString()
学习java的重点之一:InputStream 字节输入流的使用 (1)FileInputstream: 子类,读取数据的通道 使用步骤: 1.获取目标文件:new File() 2.建立通道:ne ...
- 连接oracle出现的问题以及解决办法
连接oracle出现过的问题: 1,ORA-12514::监听程序当前无法识别链接描述符中请求的服务 1)重启服务,看是否解决 2)测试网络监听是否能监听成功,监听不成功的话,查看下面几个点:服务名( ...
- 对socket的理解
要想理解socket,就得先熟悉TCP/IP协议族,TCP/IP(Transmission Control Protocol/Internet Protocol)即传输控制协议/网间协议,定义了主机如 ...
- 2014中秋节，用java为QQ游戏美女找茬写辅助
引子 今年中秋闲在家,总要找点事做. 前几天开始学python,很早之前就有计划拿下这门语言了,可惜一直拖到现在……不可否认,我也是个拖沓症患者.在学习python的过程中 ...