AngularJs 常用的过滤器


Posted in Javascript onMay 15, 2017

date格式化

{{ 1304375948024 | date }}       //结果:May 3, 2011
{{ 1304375948024 | date:"MM/dd/yyyy @ h:mma" }}  //结果:05/03/2011 @ 6:39AM
{{ 1304375948024 | date:"yyyy-MM-dd hh:mm:ss" }} //结果:2011-05-03 06:39:08

number格式化

{{ 1.234567 | number:1 }} //结果:1.2
{{ 1234567 | number }}  //结果:1,234,567

currency货币格式化

{{ 250 | currency }}     //结果:$250.00
{{ 250 | currency:"RMB ¥ " }}  //结果:RMB ¥ 250.00

filter查找

{{ [{"age": 20,"id": 10,"name": "iphone"},
{"age": 12,"id": 11,"name": "sunm xing"},
{"age": 44,"id": 12,"name": "test abc"}
] | filter:'s'}} //查找含有有s的行
 
//上例结果:[{"age":12,"id":11,"name":"sunm xing"},{"age":44,"id":12,"name":"test abc"}]
 
{{ [{"age": 20,"id": 10,"name": "iphone"},
{"age": 12,"id": 11,"name": "sunm xing"},
{"age": 44,"id": 12,"name": "test abc"}
] | filter:{'name':'iphone'} }} //查找name为iphone的行
 
//上例结果:[{"age":20,"id":10,"name":"iphone"}]

orderBy对像排序

{{ [{"age": 20,"id": 10,"name": "iphone"},
{"age": 12,"id": 11,"name": "sunm xing"},
{"age": 44,"id": 12,"name": "test abc"}
] | orderBy:'id':true }}  //根id降序排
 
{{ [{"age": 20,"id": 10,"name": "iphone"},
{"age": 12,"id": 11,"name": "sunm xing"},
{"age": 44,"id": 12,"name": "test abc"}
] | orderBy:'id' }}   //根据id升序排

limitTo字符串,对像的截取

{{ "i love tank" | limitTo:6 }}   //结果:i love
{{ "i love tank" | limitTo:-4 }}   //结果:tank
 
{{ [{"age": 20,"id": 10,"name": "iphone"},
{"age": 12,"id": 11,"name": "sunm xing"},
{"age": 44,"id": 12,"name": "test abc"}
] | limitTo:1 }}  //结果:[{"age":20,"id":10,"name":"iphone"}]

方便自己,方便他人。

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
来自国外的14个图片放大编辑的jQuery插件整理
Oct 20 Javascript
javascript实现图片切换的幻灯片效果源代码
Dec 12 Javascript
javascript实现原生ajax的几种方法介绍
Sep 21 Javascript
jquery对table中各数据的增加、保存、删除操作示例
May 14 Javascript
jQuery实现延迟跳转的方法
Jun 05 Javascript
详解JavaScript操作HTML DOM的基本方式
Oct 21 Javascript
实践中学习AngularJS表单
Mar 21 Javascript
javascript检查某个元素在数组中的索引值
Mar 30 Javascript
AngularJS入门教程之REST和定制服务详解
Aug 19 Javascript
vue使用better-scroll实现下拉刷新、上拉加载
Nov 23 Javascript
node.js使用express框架进行文件上传详解
Mar 03 Javascript
关于element的表单组件整理笔记
Feb 05 Javascript
Vue关于数据绑定出错解决办法
May 15 #Javascript
Jquery把获取到的input值转换成json
May 15 #jQuery
jQuery实现radio第一次点击选中第二次点击取消功能
May 15 #jQuery
jQuery返回定位插件详解
May 15 #jQuery
一个可复用的vue分页组件
May 15 #Javascript
jQuery操作css样式
May 15 #jQuery
Node.JS文件系统解析实例详解
May 15 #Javascript
You might like
PHP图片库imagemagick安装方法
2014/09/23 PHP
PHP输出日历表代码实例
2015/03/27 PHP
php微信公众账号开发之前五个坑(一)
2016/09/18 PHP
关于js datetime的那点事
2011/11/15 Javascript
Jquery时间验证和转换工具小例子
2013/07/01 Javascript
JavaScript中的style.cssText使用教程
2014/11/06 Javascript
jquery队列函数用法实例
2014/12/16 Javascript
JavaScript编写页面半透明遮罩效果的简单示例
2016/05/09 Javascript
解析JavaScript中的字符串类型与字符编码支持
2016/06/24 Javascript
JavaScript 闭包机制详解及实例代码
2016/10/10 Javascript
knockoutjs模板实现树形结构列表
2017/07/31 Javascript
js+SVG实现动态时钟效果
2018/07/14 Javascript
微信小程序+腾讯地图开发实现路径规划绘制
2019/05/22 Javascript
Vue实现回到顶部和底部动画效果
2019/07/31 Javascript
vue 组件销毁并重置的实现
2020/01/13 Javascript
JS控制下拉列表左右选择实例代码
2020/05/08 Javascript
python线程池的实现实例
2013/11/18 Python
python使用paramiko模块实现ssh远程登陆上传文件并执行
2014/01/27 Python
python操作xml文件示例
2014/04/07 Python
Python遍历目录中的所有文件的方法
2016/07/08 Python
python安装oracle扩展及数据库连接方法
2017/02/21 Python
Python cookbook(数据结构与算法)将名称映射到序列元素中的方法
2018/03/22 Python
Django中ajax发送post请求 报403错误CSRF验证失败解决方案
2019/08/13 Python
python lambda表达式(匿名函数)写法解析
2019/09/16 Python
Python for循环及基础用法详解
2019/11/08 Python
Python守护进程实现过程详解
2020/02/10 Python
pycharm 对代码做静态检查操作
2020/06/09 Python
Python  Asyncio模块实现的生产消费者模型的方法
2021/03/01 Python
为什么会有内存对齐
2016/10/10 面试题
高中数学教学反思
2014/01/30 职场文书
知识竞赛活动方案
2014/02/18 职场文书
供电工程专业求职信
2014/08/09 职场文书
新农村建设汇报材料
2014/08/15 职场文书
三八妇女节标语
2014/10/09 职场文书
党员公开承诺书2016
2016/03/24 职场文书
Mysql索引失效 数据库表中有索引还是查询很慢
2022/05/15 MySQL