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的gzip静态压缩方法
Jan 05 Javascript
Javascript模块化编程(三)require.js的用法及功能介绍
Jan 17 Javascript
利用js实现遮罩以及弹出可移动登录窗口
Jul 08 Javascript
JQuery的$命名冲突详细解析
Dec 28 Javascript
关闭页面时window.location事件未执行的原因分析及解决方案
Sep 01 Javascript
如何调试异步加载页面里包含的js文件
Oct 30 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
Jun 12 Javascript
微信小程序 利用css实现遮罩效果实例详解
Jan 21 Javascript
JavaScript实现实时更新系统时间的实例代码
Apr 04 Javascript
Node.js发送HTTP客户端请求并显示响应结果的方法示例
Apr 12 Javascript
javascript少儿编程关于返回值的函数内容
May 27 Javascript
jQuery+CSS实现的标签页效果示例【测试可用】
Aug 14 jQuery
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
windows环境下使用Composer安装ThinkPHP5
2018/05/18 PHP
PHP Laravel中的Trait使用方法
2019/01/20 PHP
HTML页面如何象ASP一样接受参数
2007/02/07 Javascript
xtree.js 代码
2007/03/13 Javascript
javascript document.execCommand() 常用解析
2009/12/14 Javascript
jquery中实现标签切换效果的代码
2011/03/01 Javascript
基于jquery的bankInput银行卡账号格式化
2012/08/22 Javascript
JavaScript解析URL参数示例代码
2013/08/12 Javascript
javascript关于运动的各种问题经典总结
2015/04/27 Javascript
jquery SweetAlert插件实现响应式提示框
2015/08/18 Javascript
Bootstrap每天必学之按钮(一)
2015/11/24 Javascript
用JS生成UUID的方法实例
2016/03/30 Javascript
nodejs如何获取时间戳与时间差
2016/08/03 NodeJs
ES6所改良的javascript“缺陷”问题
2016/08/23 Javascript
微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
2016/12/08 Javascript
Vue2.0中集成UEditor富文本编辑器的方法
2018/03/03 Javascript
Vue js 的生命周期(看了就懂)(推荐)
2019/03/29 Javascript
javascript异步处理与Jquery deferred对象用法总结
2019/06/04 jQuery
jQuery实现的记住帐号密码功能完整示例
2019/08/03 jQuery
原生JS实现拖拽效果
2020/12/04 Javascript
python实现排序算法
2014/02/14 Python
跟老齐学Python之模块的加载
2014/10/24 Python
Python简单定义与使用字典dict的方法示例
2017/07/25 Python
使用python matplotlib 画图导入到word中如何保证分辨率
2020/04/16 Python
python 实现音频叠加的示例
2020/10/29 Python
莫斯科高科技在线商店:KremlinStore
2019/03/13 全球购物
Feelunique德国官方网站:欧洲最大的在线美容零售商
2019/07/20 全球购物
求高于平均分的学生学号及成绩
2016/09/01 面试题
如何向接受结构参数的函数传入常数值
2016/02/17 面试题
.NET里面如何取得当前的屏幕分辨率
2012/12/06 面试题
秋天的图画教学反思
2014/05/01 职场文书
中层干部考核评语
2015/01/04 职场文书
推销搭讪开场白
2015/05/28 职场文书
Jupyter Notebook内使用argparse报错的解决方案
2021/06/03 Python
Python中的 Set 与 dict
2022/03/13 Python
微信小程序调用python模型
2022/04/21 Python