1、uppercase,lowercase 大小写转换

{{ "lower cap string" | uppercase }}   // 结果:LOWER CAP STRING
{{ "TANK is GOOD" | lowercase }} // 结果:tank is good

2、date 格式化

{{1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:25

3、number 格式化(保留小数)

{{149016.1945000 | number:2}}

4、currency货币格式化

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

5、filter查找

输入过滤器可以通过一个管道字符(|)和一个过滤器添加到指令中,该过滤器后跟一个冒号和一个模型名称。

filter 过滤器从数组中选择一个子集

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

6、limitTo 截取

{{"1234567890" | limitTo :6}} // 从前面开始截取6位
{{"1234567890" | limitTo:-4}} // 从后面开始截取4位

7、orderBy 排序

 // 根id降序排
{{ [{"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' }}

Angular js 过滤器 笔记(转自菜鸟教程)的更多相关文章

  1. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  2. Angular JS 学习笔记(一)

    1. 菜鸟教程:http://www.runoob.com/angularjs/angularjs-tutorial.html 2. Angular JS中文网:http://www.apjs.net ...

  3. Angular.js学习笔记(三)

    一.过滤器 1.uppercase,lowercase 大小写转换{{ "lower cap string" | uppercase }} // 结果:LOWER CAP STRI ...

  4. Angular.js 学习笔记

    AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序. <!-- ng-app 指令定义一个 AngularJS 应用程序. ng-mod ...

  5. Angular JS 学习笔记(二)

    1. AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面.AngularJS 通过 指令 扩展了 HTML,且通过 表达式 绑定 ...

  6. Angular.js学习笔记 (二)

    用A链接对象解析url的组成 var url = 'https://www.baidu.com:8080/aaa/1.html?id=10#name'; var aLink = document.cr ...

  7. Angular.js学习笔记 (一)

    - angular中最重要的概念是指令(directive)- ng-model 是双向数据绑定的指令,效果就是将当前元素的value属性和模型中的[user.name]建立绑定关系### 模块(Mo ...

  8. angular.js学习笔记--概念总结

    好久没更新了,现在开始学习学习angularjs,并且把学习到的一些知识总结记录一下,方便以后查找以及希望能给初学者一些帮助!(由于本人也是初学ng所以各位慎重理解!) 废话不多说,开始! $root ...

  9. Angular.JS学习笔记——1

    内容来自:http://www.runoob.com/angularjs/angularjs-intro.html AngularJS 是一个 JavaScript 框架.它是一个以 JavaScri ...

随机推荐

  1. Octave安装符号工具箱

    1.国内访问Octave的代码包不稳定,可以访问网址http://sourceforge.mirrorservice.org/o/oc/octave/Octave%20Forge%20Packages ...

  2. redis mac安装配置

    去官网下载redis. 解压后 终端cd 至目标文件夹 编译测试: sudo make test 编译安装: sudo make install 输入redis-server启动服务 停止 redis ...

  3. Javascript 中 的坑..

    ### 1. 0 == '' 返回 true 0 === '' 返回false......... 切记...

  4. 【KMP】【矩阵加速】【递推】洛谷 P3193 [HNOI2008]GT考试 题解

        看出来矩阵加速也没看出来KMP…… 题目描述 阿申准备报名参加 GT 考试,准考证号为\(N\)位数\(X_1,X_2…X_n(0\le X_i\le9)\),他不希望准考证号上出现不吉利的数 ...

  5. HDU - 3652 数位DP 套路题

    题意:统计能被13整除和含有13的数的个数 解法没法好说的..学了前面两道直接啪出来了 PS.HDU深夜日常维护,没法交题,拿网上的代码随便对拍一下,输出一致 #include<bits/std ...

  6. Oracle分组函数之CUBE魅力

    Oracle的CUBE与ROLLUP功能很相似,也是在数据统计分析领域的一把好手. 关于ROLLUP的查询统计功能请参考文章<Oracle分组函数之ROLLUP魅力>(http://www ...

  7. google风格

    复制一下代码即可: <?xml version="1.0" encoding="UTF-8" standalone="no"?> ...

  8. linux拓展之 用linux命令 管理windows一秒完成不可思议的操作--本节实战find 移动!!

    花里胡哨的东西太多,有时候觉得简单也好! 你学习了Linux,是不是觉得Linux很强大!命令的多样性结合性有没有把你征服? 在那个烈日炎炎的夏日,我下载了辣末多老男孩的视屏----但是突然我只想看t ...

  9. 【Tensorflow】 Object_detection之准备数据生成TFRecord

    参考:Preparing Inputs 1.PASCAL VOC数据集 数据集介绍: PASCAL Visual Object Classes 是一个图像物体识别竞赛,用来从真实世界的图像中识别特定对 ...

  10. pycharm + git实现两台电脑代码同步

    说明:此篇文章是作者方便日后查阅所有,请不要按本文的方法搭建 1.下载msysygit,https://git-for-windows.github.io/ 点击download获取下载链接,可能由于 ...