前面了解了AngularJS的基本用法,这里就跟着PDF一起学习下表达式的相关内容。

  在AngularJS中的表达式,与js中并不完全相同。

  首先它的表达式要放在{{}}才能使用,其次相对于javascript中的表达式概念,它有以下几点不同:

  1 作用域不同

  在javascript中默认的作用于是window,但是在angularJs中就不同了。它使用$scope控制作用于。

  2 允许未定义的值

  在angularjs中,如果使用了未定义的表达式,也不会出现错误,直接返回空值。

  3 过滤器

  可以在表达式中使用 | 管道命令符,添加过滤器,与UNIX的命令行类似。

  4 $符号

  用以区别angular的方法与用户自定义的方法。

  下面看一段小代码:

<!doctype html>
<html ng-app>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"></script>
</head>
<body>
<div ng-controller="ctl">
name:<input ng-model="name" type="text">
<button ng-click="reset()">reset</button>
<br>
{{name}}
<br>
hello ! {{test}}
<br>
filter : {{name | uppercase}}
</div>
<script type="text/javascript">
function ctl($scope){
var str = "init";
$scope.name = str; $scope.reset = function(){
$scope.name = str;
}
}
</script>
</body>
</html>

  通过reset触发reset方法,重置name变量的内容;

  在表达式中,引用了未定义的test,但是并没有报错,直接默认显示为空;—— {{test}}

  最后使用过滤器,将表达式中name的值转化成大写。—— {{name | uppercase}}

  运行结果:

【AngularJS】—— 4 表达式的更多相关文章

  1. AngularJS的表达式、指令的学习(2)

    最近没有那么忙,就来系统学习一下AngularJS吧,昨天简单的认识了一下,今天就从表达式入手吧,嘿嘿. 一.AngularJS 表达式 AngularJS表达式写在双大括号内:{{expressio ...

  2. AngularJS:表达式

    ylbtech-AngularJS:表达式 1.返回顶部 1. AngularJS 表达式 AngularJS 使用 表达式 把数据绑定到 HTML. AngularJS 表达式 AngularJS ...

  3. angularjs之表达式

    一:angularjs表达式的解析 angularjs会在运行$digest循环中自动解析表达式,但有时手动解析表达式也是非常用用的. angularjs通过$parse这个内部服务来进行表达式的运算 ...

  4. Angularjs –– Expressions(表达式)

    点击查看AngularJS系列目录 转载请注明出处:http://www.cnblogs.com/leosx/ Angular的表达式 Angular的表达式和JavaScript代码很像,不过通常A ...

  5. AngularJs解决表达式闪烁的问题(ng-cloak)

    举例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...

  6. AngularJS表达式

    1. AngularJS使用表达式把数据绑定到HTML. 2. AngularJS表达式的特点: 表达式写在双大括号内:{{表达式}}. 表达式把数据绑定到HTML,这与ng-bind指令有异曲同工之 ...

  7. AngularJS 简介、指令、表达式

    AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过指令扩展了 HTML,且通过表达式绑定数据到 HT ...

  8. AngularJS快速入门指南03:表达式

    AngularJS通过表达式将数据绑定到HTML. AngularJS表达式 AngularJS表达式写在双大括号中:{{ 表达式语句 }}. AngularJS表达式绑定数据到HTML的方式与ng- ...

  9. AngularJS 表达式 对象和数组

    AngularJS 使用 表达式 把数据绑定到 HTML. AngularJS 表达式 AngularJS 表达式写在双大括号内:{{ expression }}. AngularJS 表达式把数据绑 ...

  10. angularJS表达式详解!

    angularJS的表达式很像Javascript里的表达式:它可以包含文字,运算符和变量: angularJS 表达式: - 数字:{{100+100}} - 字符串:{{‘hello’+'angu ...

随机推荐

  1. static和public的区别

    static:静态.   可以设置:静态类.静态变量.静态方法.   没有使用static修饰的成员为实例成员. 静态成员的使用:通过类名.   1.不加static修饰的成员是对象成员,归每个对象所 ...

  2. POJ2010 Moo University - Financial Aid(二分法)

    题目地址 分析:如果用二分法,关键是score和aid分开排序,score排序是为了充分利用中位数的性质,这样就可以确定m左右必须各选N/2个,到这之后有人是用dp求最优解,可以再次按照aid排序一次 ...

  3. 重新认识unicode和utf8编码

    重新认识unicode和utf8编码 直到今天,准确的说是刚才,我才知道UTF-8编码和Unicode编码是不一样的,是有区别的囧 他们之间是有一定的联系的,看看他们的区别: UTF-8的长度是不一定 ...

  4. java里面时间差比较

    currentTime.before(this.getLastActivateTime(time))//返回true 或者false public Date getLastActivateTime(t ...

  5. hdu 2034 - 集合操作

    题意:集合A,B,计算集合差A-B(求只在集合A内的数) 解法: 选用STL内的集合set 1.建立set 1: #include<set> 2:   3: set<int> ...

  6. jboss性能优化

    jboss     linux jboss 部署时优化设置: 在/conf/web.xml中通过参数指定: <session-config>          <session-ti ...

  7. java8 中的时间和数据的变化

    java8除了lambda表达式之外还对时间和数组这两块常用API做想应调整, Stream 有几个常用函数: store 排序 (a,b)-> a.compareTo(b)  排出来的结果是正 ...

  8. spark操作elasticsearch数据的限制

    对于复杂的数据类型,比如IP和GeoPoint,只是在elasticsearch中有效,用spark读取时会转换成常用的String类型. Geo types. It is worth mention ...

  9. 使用ASP.NET Web Api构建基于REST风格的服务实战系列教程【六】——实现资源间的关联

    系列导航地址http://www.cnblogs.com/fzrain/p/3490137.html 前言 这一篇文章主要介绍一下资源间的关联——例如在学生和课程之间就存在这样的关联:每一个课程都会有 ...

  10. notification的使用

    示例: NotificationManager nm = (NotificationManager)getSystemService(Context.NOTIFICATION_SERVICE); No ...