[angularjs] angularjs系列笔记(四)过滤器
过滤器可以使用一个管道字符(|)添加到表达式和指令中,这不就是模板函数吗
<body>
<div ng-app="Home">
<div ng-controller="Index">
格式化字符串为小写
{{myName()|lowercase}}。
格式化字符串为大写
{{myName()|uppercase}}。
格式化数字为货币格式
{{price|currency}}。
根据某个表达式排列数组
<p ng-repeat="x in prices | orderBy:'price'">{{x.price}}</p>
。
取出数组中的子元素
<input type="text" ng-model="test">
<p ng-repeat="x in prices |filter:test | orderBy:'price'">{{x.price}}</p>
。
</div>
</div> </body> <script type="text/javascript">
//实例化应用对象,参数:模块名,空数组
var app=angular.module("Home",[]);
//调用Application对象的controller()方法
app.controller("Index",function($scope){
$scope.myName=function(){
return "Tao"+"ShiHan";
}
$scope.price=5;
$scope.prices=[{price:1},{price:5},{price:3}];
});
</script>
[angularjs] angularjs系列笔记(四)过滤器的更多相关文章
- PE文件学习系列笔记四-C++实现PE文件的分析
合肥程序员群:49313181. 合肥实名程序员群:128131462 (不愿透露姓名和信息者勿加入) Q Q:408365330 E-Mail:egojit@qq.com 综述: 首 ...
- angularjs自动化测试系列之jasmine
angularjs自动化测试系列之jasmine jasmine参考 html <!DOCTYPE html> <html lang="en"> <h ...
- angularjs自动化测试系列之karma
angularjs自动化测试系列之karma karma test with jasmine 更好的利用工具是为了让生活更美好. 需要安装的东西: npm install karma -g mkdir ...
- AngularJS路由系列(6)-- UI-Router的嵌套State
本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...
- AngularJS路由系列(5)-- UI-Router的路由约束、Resolve属性、路由附加数据、路由进入退出事件
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router约束路由参数● UI-Router的Resolve属性● UI-Router给路由附加数据● UI- ...
- AngularJS路由系列(4)-- UI-Router的$state服务、路由事件、获取路由参数
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router的$state服务● UI-Router的路由事件● UI-Router获取路由参数 Angular ...
- AngularJS路由系列(3)-- UI-Router初体验
本系列探寻AngularJS的路由机制,在WebStorm下开发. AngularJS路由系列包括: 1.AngularJS路由系列(1)--基本路由配置2.AngularJS路由系列(2)--刷新. ...
- AngularJS路由系列(2)--刷新、查看路由,路由事件和URL格式,获取路由参数,路由的Resolve
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 刷新路由● 查看当前路由以及所有路由● 路由触发事件● 获取路由参数 ● 路由的resolve属性● 路由URL格式 ...
- AngularJS路由系列(1)--基本路由配置
本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 路由的Big Picture ● $routeProvider配置路由 ● 使用template属性 ● 使用temp ...
- C#可扩展编程之MEF学习笔记(四):见证奇迹的时刻
前面三篇讲了MEF的基础和基本到导入导出方法,下面就是见证MEF真正魅力所在的时刻.如果没有看过前面的文章,请到我的博客首页查看. 前面我们都是在一个项目中写了一个类来测试的,但实际开发中,我们往往要 ...
随机推荐
- Django+easyui 快速开发
Django的使用我们可以查看上一篇博客,今天我们要在Django中使用easyui快速开发,在我们安装好Django, 我们可以道改地址那一下easyui 官方API文档(http://downlo ...
- 运维工具pssh和pdsh安装和使用
1. pssh安装与使用 1.1 pssh安装 [root@server]# wget http://peak.telecommunity.com/dist/ez_setup.py [root@ser ...
- linux-ssh登陆导语
用户登录前显示的导语信息(在你选择的文件中配置,例如 /etc/login.warn) 用户成功登录后显示的导语信息(在 /etc/motd 中配置) 如何在用户登录前连接系统时显示消息 当用户连接到 ...
- PMP:8.项目质量管理
内容中包含 base64string 图片造成字符过多,拒绝显示
- day19_雷神_django第二天
django_day02 Django的路由系统 URL配置(URLconf)就像Django所支撑网站的目录.它的本质是URL与要为该URL调用的视图函数之间的映射表. 1.URLconf配置 基本 ...
- Redhat/CentOS7-环境虚拟机简单搭建Nginx+Tomcat负载均衡集群
Tomcat服务器是一个免费的开放源代码的web应用服务器,属于轻量级应用服务器,是开发和调试JSP程序的首选.由于Tomcat处理静态HTML的能力运不及Apache或者Nginx,所以Tomcat ...
- 两张图彻底搞懂MyBatis的Mapper原理!
作者:肥朝 简单使用 这是一个简单的Mybatis保存对象的例子 1@Test 2public void testSave() throws Exception { 3 //创建sessionFact ...
- Material Design 开源项目总结
Android开发中,我们不免会遇到Material Design展示的需求,以下是本人之前star的开源项目,供大家参考: 一.RippleEffect 项目地址:https://github.co ...
- Javascript高级编程学习笔记(51)—— DOM2和DOM3(3)操作样式表
操作样式表 在JS中样式表用一种类型来表示,以便我们在JS对其进行操作 这一类型就是CSSStyleSheet 即CSS样式表类型,包括了之前 style 对象所不包括的外部样式表以及嵌入样式表 其中 ...
- zabbix3.2 C/S架构搭建文档
zabbix 是用PHP开发的.得需要搭建LAMP环境 zabbix-server 192.168.1.101zabbix-agent 192.168.1.105 zabbix 下载 https:/ ...