angularJS过滤器

filter

currency

date

filter

json

limitTo

lowercase

number

orderBy

uppercase

......

Filter过滤器

过滤器的主要用途就是一个格式化 / 筛选数据的小工具;

一般用于服务端存储的数据转换为用户界面可以理解的数据;

常见需要使用Filter的数据有:

- 时间 1288323623006

currency:它是用来过滤货币
作用把数字过滤成 一个货币:
使用:竖杠+过滤器名称
<div ng-app=>
<h1>{{20000 | currency}}</h1>
</div>
//效果:$20,000.00

没有多少意义,国际标准货币,对我们不实用;

date :转化为时间

<div ng-app=>
<h1>{{1288323623006 | date}}</h1>//效果 Oct 29, 2010
<h1>{{1288323623006 | date:'yyyy-MM-dd HH:mm:ss'}}</h1>//效果 2010-10-29 11:40:23
// 这里是英文的
可以使用 angular-locale_zh-cn.js 来进行汉化
</div>

json过滤器

<div ng-app="myApp" ng-controller="myAppController">
{{jsonDate}}<br>
{{jsonDate | json}}
</div>
<script type="text/javascript">
var myApp = angular.module('myApp',[]);
myApp.controller('myAppController',['$scope',function($scope){
$scope.jsonDate = {
zifuchuan:'张三',
shuzi:19,
bool:false,
json:{name:'老王',age:18},
shuzu:[{name:'老王',age:'18'},{name:'老王',age:'18'}]
};
}]);
</script>

limitTo过滤器:限制到:

作用:用来控制字符串展示多少长度;

<div ng-app>{{'www.baidu.com,baidu.com' | limitTo:10}}</div>
//www.baidu.

具体语法:

{{limiTo_expression | limitTo:limit:begin}}

limit是必选项,begin是可选项;

number过滤器: 格式化(保留小数)这里会进行四舍五入

<div ng-app>{{1459824.1542558 | number:2}}</div>
// 效果:1,459,824.15

接下来的过滤器,在使用过程中在做阐述;

angularJS的过滤器!的更多相关文章

  1. AngularJS学习--- 过滤器(filter),格式化要显示的数据 step 9

    1.切换目录,启动项目 git checkout step- npm start 2.需求: 格式化要显示的数据. 比如要将true-->yes,false-->no,这样相互替换. 3. ...

  2. AngularJS开发指南13:AngularJS的过滤器详解

    AngularJS过滤器是用来格式化输出数据的.除了格式化数据,过滤器还能修改DOM.这使得过滤器通常用来做些如“适时的给输出加入CSS样式”等工作. 比如,你可能有些数据在输出之前需要根据进行本地化 ...

  3. 走进AngularJs(七) 过滤器(filter) - 吕大豹

    时间 2013-12-15 16:22:00  博客园-原创精华区 原文  http://www.cnblogs.com/lvdabao/p/3475426.html 主题 AngularJS 过滤器 ...

  4. AngularJs(八) 过滤器filter创建

    大纲 示例 过滤器的使用 创建过滤器 demo 这是整个示例demo 1.filter.js文件 angular.module("exampleApp", []) .constan ...

  5. 创建 AngularJS 自定义过滤器,带自定义参数

    Angularjs过滤器是 angularjs非常棒的特性之一.有朝一日,你可能需要使用自定义过滤器,幸运的是,你找到了这篇博文. 下面显示的是自定义过滤器长什么样子(请注意myfilter): &l ...

  6. AngularJs自定义过滤器filter

    AngularJs自带有很多过滤器,现在Insus.NET演示一个自定义的过滤器,如实现一个数据的平方. 本演示是在ASP.NET MVC环境中进行. 创建一个app: 创建一个控制器: 接下来是重点 ...

  7. AngularJS之过滤器

    AnularJS的过滤器用来格式化需要展示给用户的数据,有很多实用的内置过滤器,也可以自己编写. 在HTML中的模板绑定符号{{ }}内通过|符号来调用过滤器.例如,假设我们希望将字符串转换成大写,可 ...

  8. AngularJS:过滤器

    ylbtech-AngularJS:过滤器 1.返回顶部 1. AngularJS 过滤器 过滤器可以使用一个管道字符(|)添加到表达式和指令中. AngularJS 过滤器 AngularJS 过滤 ...

  9. AngularJS 五 过滤器及验证

    AngularJS过滤: AngularJS过滤器允许我们格式化数据以在UI上显示而不改变原始格式. 格式: 一些比较重要的过滤器: Number               Filter       ...

随机推荐

  1. Rattle:数据挖掘的界面化操作

    R语言是一个自由.免费.源代码开放的软件,它是一个用于统计计算和统计制图的优秀工具.这里的统计计算可以是数据分析.建模或是数据挖掘等,通过无数大牛提供的软件包,可以帮我们轻松实现算法的实施. 一些读者 ...

  2. hadoop学习WordCount+Block+Split+Shuffle+Map+Reduce技术详解

    转自:http://blog.csdn.net/yczws1/article/details/21899007 纯干货:通过WourdCount程序示例:详细讲解MapReduce之Block+Spl ...

  3. 【转】C#调用WebService实例和开发

    一.基本概念 Web Service也叫XML Web Service WebService是一种可以接收从Internet或者Intranet上的其它系统中传递过来的请求,轻量级的独立的通讯技术.是 ...

  4. UIView的几个枚举定义

    UIView是iOS开发最主要的视图,非常多控件都是继承它,掌握当中的几个基本枚举定义,有利益理解视图的载入和參数差别. 一.UIViewAnimationCurve UIView的基本动画变化规律 ...

  5. par函数的bg参数-控制图片的背景色

    bg 参数用于控制图片的背景色,默认为白色 代码示例: par(bg = "pink") plot(1:5, 1:5, main = "title", xlab ...

  6. 世界上最痛苦的事就是去改别人的bug!!!!

    世界上最痛苦的事就是去改别人的bug!!!!

  7. 【Java NIO的深入研究】 ServerSocketChannel

    Java NIO中的 ServerSocketChannel 是一个可以监听新进来的TCP连接的通道, 就像标准IO中的ServerSocket一样.ServerSocketChannel类在 jav ...

  8. 小明A+B(杭电2096)

    /*小明A+B Problem Description 小明今年3岁了, 如今他已经可以认识100以内的非负整数, 而且可以进行100以内的非负整数的加法计算. 对于大于等于100的整数, 小明仅保留 ...

  9. git分支合并的冲突解决方法

    本次学习的是解决不同分支提交的内容不同导致合并冲突,及怎样解决冲突.       基本命令: git log --graph查看分支合并图       具体步骤: 新建分支branch1,并修改rea ...

  10. AI逻辑实现-取舍行为树还是状态机

    AI逻辑实现-选择行为树还是状态机? 关注AI的朋友可能会看过赖勇浩翻译的<有限状态机时代终结的10大理由> ,里面谈到了状态机的诸多弊端.同时在ppt(附上下载地址)中述说了行为树的诸多 ...