文档章节

Angular js 学习之filter 过滤器

挨踢的小耗子
 挨踢的小耗子
发布于 2015/12/07 23:36
字数 302
阅读 9
收藏 0

     工作中用的angular js 前端开发,今天做了个filter 的功能,顺便总结下angular js 的过滤器的用法。

  • in Html template binding : 主要是在html 页面使用,具体用法如下

{{ filter_expression | filter : expression : comparator}}

该用法可以使用angular 内置的九种过滤器,分别为

{{num | currency : '¥'}}

{{date | date : 'yyyy-MM-dd hh:mm:ss EEEE'}}

{{ array | filter : 'a' }} //匹配属性值中含有a的,如果是对象数组的唯一匹配,最好用参数对象匹配,以防止出现
匹配不严密的情况
可以匹配数组,数组对象,返回匹配出的数组
{{objectArray | filter : {name : 'i'} }} //参数是对象,匹配name属性中含有i的

{{ jsonTest | json}}
json过滤器可以把一个js对象格式化为json字符串,没有参数

{{ array| limitTo : 2 }}  //将会显示数组中的前两项

lowercase(小写),uppercase(大写),number(格式化数字),orderBy(排序)

  • in javascript:在js中

$filter('filter')(array, expression, comparator)

该用法主要在js 中使用,需要把filter 注入进来,以上9种内置都可使用。

  • 自定义filter

可以通过函数或其它定制自己的filter已达到程序的要求。添加待续

© 著作权归作者所有

共有 人打赏支持
挨踢的小耗子
粉丝 1
博文 3
码字总数 582
作品 0
朝阳
程序员
AngularJs学习笔记--expression

一、Angular表达式 vs. Js 表达式   这很容易让人将angular视图表达式联想为javascript表达式,但这并不完全正确,因为angular不是通过javascript的eval()对表达式进行求值。你可以将angul...

武文海
2015/02/06
0
0
Angular.js 相关记录

AngularJS作用域文档:http://docs.angularjs.org/api/ng.$rootScope.Scope ng-view 指令的角色是为当前路由把对应的视图模板载入到布局模板中。 AngularJS内置过滤器:http://code.angular...

彭博
2014/04/25
0
2
AngularJs学习笔记--I18n/L10n

一、I18n and L10n in AngularJS 1. 什么是I18n和L10n?   国际化(Internationalization),简称I18n,是让产品开发在一个他们可以简单地对产品进行语言、文化的本地化的方法的规范。本地化...

武文海
2015/02/06
0
0
5个示例带你学习AngularJS

本文由 伯乐在线 - 蝈蝈 翻译自 tutorialzine。欢迎加入技术翻译小组。转载请参见文章末尾处的要求。 直到现在,你或许已经听说过AngularJS了,一个改变你对web应用思考方式,由谷歌开发的令...

冬瓜1
2013/12/30
0
0
angular.js,backbone.js,ember.js区别

1 backbone. 对于初学者来说,我非常建议首先学习backbone 而不是jQuery. 因为jQuery提供的功能是操作DOM和Ajax数据传输. 而Backbone的功能和目的仅仅是提供一个javascript的MVC 实际针对Web...

造化玉碟
2014/04/05
0
2

没有更多内容

加载失败,请刷新页面

加载更多

kubeadm部署kubernetes集群

一、环境要求 这里使用RHEL7.5 master、etcd:192.168.10.101,主机名:master node1:192.168.10.103,主机名:node1 node2:192.168.10.104,主机名:node2 所有机子能基于主机名通信,编辑...

人在艹木中
今天
2
0
Shell特殊符号总结以及cut,sort,wc,uniq,tee,tr,split命令

特殊符号总结一 * 任意个任意字符 ? 任意一个字符 # 注释字符 \ 脱义字符 | 管道符 # #号后的备注被忽略[root@centos01 ~]# ls a.txt # 备注 a.txt[root@centos01 ~]# a=1[root@centos01...

野雪球
今天
2
0
OSChina 周二乱弹 —— 程序员圣衣

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @达尔文:分享Skeeter Davis的单曲《The End of the World》 《The End of the World》- Skeeter Davis 手机党少年们想听歌,请使劲儿戳(这里...

小小编辑
今天
14
0
[ python import module ] 导入模块

import moudle_name ----> import module_name.py ---> import module_name.py文件路径 -----> sys.path (这里进行查找文件) # from app.web import Personimport app.web.Person as Pe......

_______-
昨天
5
0
Redis性能问题排查解决手册

一、性能相关的数据指标 通过Redis-cli命令行界面访问到Redis服务器,然后使用info命令获取所有与Redis服务相关的信息。通过这些信息来分析文章后面提到的一些性能指标。 nfo命令输出的数据可...

IT--小哥
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部