AngularJS---表达式
AngularJS的表达式是放在{{}}里面，用{{ }}符号将一个变量绑定到$scope上。
angularJS中的表达式有如下特点：
1.只能在其所属作用域内部
所有的表达式都在其所属的作用域内部执行，并有访问本地$scope的权限。
2.允许未定义
在html中可以使用未在angularJS定义的变量，不会抛出异常
3.不能使用流控制
不能使用任何流控制包括条件语句，如if/else
4.过滤器
可以接收过滤器和过滤器链，使用 | 符号连接过滤器
请看小例子：
<!doctype html>
<html ng-app>
<head>
<meta charset="utf-8" />
<script src="https://code.angularjs.org/1.2.16/angular.min.js"></script>
</head>
<body>
<div ng-controller="Controller">
<button ng-click="change()">change</button>
<br>
显示：{{ person }}
<br>
未显示{{undefine}}
<br>
过滤显示：{{person | uppercase}}
</div>
<script type="text/javascript">
function Controller($scope){
$scope.person = 'monkey';
$scope.change = function(){
$scope.person = 'cat';
}
}
</script>
</body>
</html>
自定义过滤器：
html文件：
<!doctype html>
<html ng-app="myApp">
<head>
<meta charset="utf-8" />
<script src="https://code.angularjs.org/1.2.16/angular.min.js"></script>
</head>
<body>
<div ng-controller="Controller">
<button ng-click="change()">change</button>
<br>
显示：{{ person }}
<br>
未显示{{undefine}}
<br>
过滤显示（大写）：{{person | uppercase}}
<br>
过滤显示（首字母大写）：{{person | capitalize}}
<br>
过滤显示（首字母大写）：{{person | lowercase | capitalize}}
</div>
<script type="text/javascript" src="./app.js"></script>
</body>
</html>
app.js文件：
var app = angular.module("myApp",[]);
app.controller('Controller',function($scope){
$scope.person = 'monkey';
$scope.change = function(){
$scope.person = 'cat';
}
})
app.filter('capitalize',function(){
return function(input){ //input是我们传入的字符串
if (input) {
return input[0].toUpperCase() + input.slice(1);
}
}
})
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 ...
- 【04】AngularJS 表达式
AngularJS 表达式 AngularJS 使用 表达式 把数据绑定到 HTML. AngularJS 表达式 AngularJS 表达式写在双大括号内:{{ expression }}. Ang ...
- 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 ...
随机推荐
- vi学习 常用命令-新建-复制-剪切-粘贴
mkdir /home/brandon.du/desktop/mylinux/test_1.txt ---------mkdir新建文件夹 rm /home/brandon.du/desktop/ ...
- matlab中的数据结构
一.cell 1. function: num2cell(A,n) n表示如何把A中的数据转换为cell. n=1表示把每列的所有行转换为cell:n=2表示把每行的所有列转换为cell. >& ...
- JAVA(3)
接口注意事项: 1.接口不能被实例化 2.接口中所有的方法都不能有主体 (不能有{ }) 3.一个类可以实现多个接口 4.接口中可以有变量<但变量不能用private和protected修饰& ...
- Java(二)
课后,我查阅相关学习资料和Java API制作了以下界面,界面包含了单选按钮(JRadioButton).复选框(JCheckBox).组合框(JComboBox).单行文本输入框(JTextFiel ...
- 【转】JavaScript 经常忽略的 7 个基础知识点
原文转自:http://bbs.html5cn.org/thread-83442-1-1.html 1. 在 String.prototype.replace 方法中使用 /g 和 /i标志位 令很多 ...
- 1-Spark高级数据分析-第一章 大数据分析
1.1 数据科学面临的挑战 第一,成功的分析中绝大部分工作是数据预处理. 第二,迭代与数据科学紧密相关.建模和分析经常需要对一个数据集进行多次遍历.这其中一方面是由机器学习算法和统计过程本身造成的. ...
- JQuery EasyUI DataGrid常用操作及注意事项（未完）
1.获取当前选中行,如果没有选中行,则返回 null var row = $('#gridID').datagrid('getSelected'); 2.获取当前所有选中行数据,返回的是选择的数组数据 ...
- Spring mvc shiro 整合
参考 : http://www.360doc.com/content/14/0722/10/18637323_396209195.shtml http://www.360doc.com/content ...
- 51nod 1126 矩阵快速幂 水
有一个序列是这样定义的:f(1) = 1, f(2) = 1, f(n) = (A * f(n - 1) + B * f(n - 2)) mod 7. 给出A,B和N,求f(n)的值. Input 输 ...
- SQL Server COM 组件创建实例失败
SQL Server COM 组件创建实例失败 SQL2008数据库总会出现从 IClassFactory 为 CLSID 为 {17BCA6E8-A95D-497E-B2F9-AF6AA4759 ...