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 相关文章推荐
用XMLDOM和ADODB.Stream实现base64编码解码实现代码
Nov 28 Javascript
jQuery控制元素显示、隐藏、切换、滑动的方法总结
Apr 16 Javascript
PageSwitch插件实现100种不同图片切换效果
Jul 28 Javascript
JS根据key值获取URL中的参数值及把URL的参数转换成json对象
Aug 26 Javascript
详解在Vue中有条件地使用CSS类
Sep 30 Javascript
React中的refs的使用教程
Feb 13 Javascript
vue实现学生录入系统之添加删除功能
Jul 11 Javascript
vue 点击按钮实现动态挂载子组件的方法
Sep 07 Javascript
微信小程序实现下拉菜单切换效果
Mar 30 Javascript
vue多级复杂列表展开/折叠及全选/分组全选实现
Nov 05 Javascript
JavaScript实现的滚动公告特效【基于jQuery】
Jul 10 jQuery
node实现简单的增删改查接口实例代码
Aug 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
PHP扩展编写点滴 技巧收集
2010/03/09 PHP
PHP Curl模拟登录微信公众平台、新浪微博实例代码
2016/01/28 PHP
PHP针对字符串开头和结尾的判断方法
2016/07/11 PHP
Yii2语言国际化的配置教程
2018/08/19 PHP
php桥接模式应用案例分析
2019/10/23 PHP
xml和web特殊字符
2009/04/28 Javascript
Google的跟踪代码 动态加载js代码方法应用
2012/11/12 Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
2013/07/17 Javascript
Javascript事件实例详解
2013/11/06 Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
2014/06/15 Javascript
24款热门实用的jQuery插件推荐
2014/12/24 Javascript
jquery自适应布局的简单实例
2016/05/28 Javascript
轻松掌握JavaScript中介者模式
2016/08/26 Javascript
使用bootstrapValidator插件进行动态添加表单元素并校验
2016/09/28 Javascript
JS获取字符对应的ASCII码实例
2017/09/10 Javascript
JavaScript实现百度搜索框效果
2020/03/26 Javascript
vue中实现左右联动的效果
2018/06/22 Javascript
微信小程序实现单选选项卡切换效果
2020/06/19 Javascript
用Vue编写抽象组件的方法
2019/05/06 Javascript
uni-app微信小程序登录授权的实现
2020/05/22 Javascript
使用优化器来提升Python程序的执行效率的教程
2015/04/02 Python
python实现中文输出的两种方法
2015/05/09 Python
django 信号调度机制详解
2019/07/19 Python
解决pycharm最左侧Tool Buttons显示不全的问题
2019/12/17 Python
科尔士百货公司官网:Kohl’s
2016/07/11 全球购物
美国购买体育、音乐会和剧院门票网站:SelectATicket
2019/09/08 全球购物
如何将整数int转换成字串String
2014/03/21 面试题
货物运输服务质量承诺书
2014/05/29 职场文书
2014年大学生社会实践自我鉴定
2014/09/26 职场文书
民主生活会对照检查材料思想汇报
2014/09/27 职场文书
高三教师工作总结2015
2015/07/21 职场文书
中秋节主题班会
2015/08/14 职场文书
初三英语教学反思
2016/02/15 职场文书
mysql 带多个条件的查询方式
2021/06/05 MySQL
SQLServer 错误: 15404,无法获取有关 Windows NT 组/用户 WIN-8IVSNAQS8T7\Administrator 的信息
2021/06/30 SQL Server
python 离散点图画法的实现
2022/04/01 Python