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 相关文章推荐
什么是JavaScript
Aug 13 Javascript
Javascript倒计时页面跳转实例小结
Sep 11 Javascript
JS中的数组的sort方法使用示例
Jan 22 Javascript
在JavaScript中判断整型的N种方法示例介绍
Jun 18 Javascript
javascript 控制input只允许输入的各种指定内容
Jun 19 Javascript
深入浅出ES6之let和const命令
Aug 25 Javascript
JS数组操作中的经典算法实例讲解
Jul 26 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
May 04 Javascript
使用angularjs.foreach时return的问题解决
Sep 30 Javascript
Vue js 的生命周期(看了就懂)(推荐)
Mar 29 Javascript
24个解决实际问题的ES6代码片段(小结)
Feb 02 Javascript
JavaScript实现H5接金币功能(实例代码)
Feb 22 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
杏林同学录(七)
2006/10/09 PHP
中国站长站 For Dede4.0 采集规则
2007/05/27 PHP
PHP表单提交表单名称含有点号(.)则会被转化为下划线(_)
2011/12/14 PHP
Linux安装配置php环境的方法
2016/01/14 PHP
PHP下用Swoole实现Actor并发模型的方法
2019/06/12 PHP
分享一个我自己写的ToolTip提示插件(附源码)
2013/01/20 Javascript
如何让页面加载完成后执行js
2013/06/26 Javascript
jquery特效 点击展示与隐藏全文
2015/12/09 Javascript
jQuery如何封装输入框插件
2016/08/19 Javascript
微信小程序 location API接口详解及实例代码
2016/10/12 Javascript
JavaScript排序算法动画演示效果的实现方法
2016/10/18 Javascript
vue-router路由简单案例介绍
2017/02/21 Javascript
JS实现图片居中悬浮效果
2017/12/25 Javascript
微信小程序冒泡事件及其阻止方法实例分析
2018/12/06 Javascript
vue动态配置模板 'component is'代码
2019/07/04 Javascript
layui自定义工具栏的方法
2019/09/19 Javascript
解决VUE自定义拖拽指令时 onmouseup 与 click事件冲突问题
2020/07/24 Javascript
[01:06:19]DOTA2-DPC中国联赛定级赛 LBZS vs SAG BO3第二场 1月8日
2021/03/11 DOTA
python创建进程fork用法
2015/06/04 Python
Python中pygame安装方法图文详解
2015/11/11 Python
Python输出汉字字库及将文字转换为图片的方法
2016/06/04 Python
python安装PIL模块时Unable to find vcvarsall.bat错误的解决方法
2016/09/19 Python
Python 爬虫学习笔记之正则表达式
2016/09/21 Python
python内置函数:lambda、map、filter简单介绍
2017/11/16 Python
Python常见字符串操作函数小结【split()、join()、strip()】
2018/02/02 Python
Python基于递归算法实现的汉诺塔与Fibonacci数列示例
2018/04/18 Python
详解Python数据可视化编程 - 词云生成并保存(jieba+WordCloud)
2019/03/26 Python
安装pyinstaller遇到的各种问题(小结)
2020/11/20 Python
Python logging自定义字段输出及打印颜色
2020/11/30 Python
Python3使用tesserocr识别字母数字验证码的实现
2021/01/29 Python
加拿大领先家居家具网上购物:Aosom.ca
2020/05/27 全球购物
股份合作协议书范本
2014/04/14 职场文书
小班上学期个人总结
2015/02/12 职场文书
信息技术研修心得体会
2016/01/08 职场文书
2016大一新生军训心得体会
2016/01/11 职场文书
什么是求职信?求职信应包含哪些内容?
2019/08/14 职场文书