首先,介绍下$filter服务:
1、$filter是用来进行数据格式化的专用服务;
2、AngularJS内置了currency、date、filter、json、limitTo、lowercase、uppercase、number、orderBy这8个filter;
3、filter可以嵌套使用,用管道符号"|"来分隔(有点像linux);
4、filter可以传递参数;
5、用户可自定义filter。
 
介绍下内置filter:
currency:用于格式化货币,如在数值前自动加上"$"或"¥"之类的。
date:格式化日期,它会提供丰富的日期格式。
json:完成json格式化。
number:如转成两位小数等。
orderBy:进行排序。
 
filter的简单使用:
{{ 1304375948024 | date }}
{{ 1304375948024 | date:"MM/dd/yyyy h:mma" }}
{{ 1304375948024 | date:"yyyy-MM-dd hh:mm:ss" }}
{{ 30 | currency }}
输出:
May 3, 2011 
05/03/2011 6:39AM 
2011-05-03 06:39:08
$30.00
 
自定义filter:
eg:
var myModule = angular.module('myModule',[]);
myModule.filter('myFilter',function(){
return function(item){
return 'Hi,'+item;
}
});
使用: {{ 'JennyLin' | myFilter }}
 
ps:这个是我在慕课上学大漠穷秋老师的angular时做的笔记。

angular的$filter服务的更多相关文章

  1. Angular之filter学习

    过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果.主要用在数据的格式化上,例如获取一个数组中的子集,对数组中的元素进行排序等.ng内置了一些过滤器,它们 ...

  2. angular的filter

    angular的filter filter两种用法 1.在模板中使用filter {{expression|filter}}//基本用法 {{expression|filter1|filter2|fi ...

  3. 介绍Angular的注入服务

    其实angular的注入服务是挺复杂的,目前看源码也只看懂了一半,为了不误导大家,我也不讲敢讲太复杂,怕自己都理解错了. 首先我们要知道angular的三种注入方式: 第一种:inference va ...

  4. Angular.js之服务与自定义服务学习笔记

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. angular访问后台服务及监控会话超时的封装

    angular访问后台服务及监控会话超时的封装 angular本身自带访问组件http和httpclient,组件本身都是异步模式访问.本文只列举了对http组件的封装同时也一同处理会话超时监控. 获 ...

  6. angular中的服务

    angular中的服务 angular中的服务相当于一个状态管理,可以将数据放在服务里面进行获取以及编辑. 服务的安装命令: ng g service count 安装好后,会在服务的ts文件中引入一 ...

  7. angular的uiRouter服务学习(4)

    本篇接着上一篇angular的uiRouter服务学习(3)继续讲解uiRouter的用法 本篇主要讲解uiRouter的url路由 大多数情况下,状态是和url相关联的: 当url改变,激活对应的状 ...

  8. angular的uiRouter服务学习(3)

    本篇接着上一篇 angular的uiRouter服务学习(2) 继续讲解uiRouter的用法 本篇主要讲解uiRouter的多个命名的视图 我们可以给ui-view元素添加ui-view的值来给它命 ...

  9. angular的uiRouter服务学习(2)

    本篇接着上一篇 angular的uiRouter服务学习(1) 继续讲解uiRouter的用法 本篇主要讲解uiRouter的嵌套状态&嵌套视图 嵌套状态的方法: 状态和状态之间可以互相嵌套, ...

随机推荐

  1. css元素水平居中和垂直居中的方式

    关于居中的问题,一直处于疑惑不解的状态,知道的几种方法好像也不是每一次都会起到作用,所以更加迷惑.主要是不清楚该 在什么情况下采用哪种解决方法,所以,整理了一些方法,梳理一下思路,做一个总结. 1. ...

  2. 用django创建一个项目

    首先你得安装好python和django,然后配置好环境变量,安装python就不说了,从配置环境变量开始 1.配置环境变量 在我的电脑处点击右键,或者打开 控制面板\系统和安全\系统 -> 左 ...

  3. 使用Microsoft的IoC框架:Unity来对.NET应用进行解耦

    1.IoC/DI简介 IoC 即 Inversion of Control,DI 即 Dependency Injection,前一个中文含义为控制反转,后一个译为依赖注入,可以理解成一种编程模式,详 ...

  4. iOS之应用版本号的设置规则

    版本号的格式:v<主版本号>.<副版本号>.<发布号>  版本号的初始值:v1.0.0 管理规则: 主版本号(Major version) 1.  产品的主体构件进 ...

  5. Android事件分发机制浅谈(一)

    ---恢复内容开始--- 一.是什么 我们首先要了解什么是事件分发,通俗的讲就是,当一个触摸事件发生的时候,从一个窗口到一个视图,再到一个视图,直至被消费的过程. 二.做什么 在深入学习android ...

  6. oracle 误删数据恢复

    1.根据时间点查系统版本号scn: select timestamp_to_scn(to_timestamp('2013-01-07 11:20:00','YYYY-MM-DD HH:MI:SS')) ...

  7. ORA-00821: Specified value of sga_target 3072M is too small, needs to be at least 12896M

    在测试PlateSpine克隆的数据库服务器时,由于资源有限,克隆过来的数据库服务器只给了9G的内存,结果在测试时,老是会出现OOMkiller导致宕机,即out of memory killer,是 ...

  8. Android快乐贪吃蛇游戏实战项目开发教程-01项目概述与目录

    一.项目简介 贪吃蛇是一个很经典的游戏,也很适合用来学习.本教程将和大家一起做一个Android版的贪吃蛇游戏. 我已经将做好的案例上传到了应用宝,无病毒.无广告,大家可以放心下载下来把玩一下.应用宝 ...

  9. linux压缩和解压缩命令大全

    .tar 解包:tar zxvf FileName.tar 打包:tar czvf FileName.tar DirName ------------------------------------- ...

  10. Spring.Net在Mvc4.0中应用的说明

    案例Demo:http://yunpan.cn/cJ5aZrm7Uybi3 访问密码 414b Spring.Net在Mvc4.0中应用的说明 1.引用dll 2.修改Global文件 (Spring ...