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. C# 在Bitmap上绘制文字出现锯齿的问题

    解决锯齿问题主要是修改Graphics的属性 修复绘制图片锯齿问题可以修改 g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiA ...

  2. int、long、longlong、float、double、long double的范围

  3. circRNA 序列提取中的难点

    在预测circRNA时,都是检测breakpoint 处的reads 数,最后给出的环状RNA的ID 都是诸如 chr14:106994222-107183708 这样的形式,给出了起始和终止位置: ...

  4. tRNA 二级结构预测可视化

    tRNAdb 收录了来自104个物种的623条tRNA 序列,从数据库中下载对应物种的tRNA 序列和二级结构,以人为例 打开下面的链接 http://trna.bioinf.uni-leipzig. ...

  5. vncserver的安装和使用

    环境:RedHat Linux 6企业版.Xwindows:gnome (红帽默认安装的图形界面) 尽管我们可以使用SSH连接远程通过字符界面来操作Linux,但是对于更多熟悉图形人来说是很不方便的, ...

  6. 获取作为 URL 部署清单的位置。

    ActivationContext ac = AppDomain.CurrentDomain.ActivationContext; ApplicationIdentity ai = ac.Identi ...

  7. EF修改对象里面的值。。。(对象字段多的时候)

    后台代码 public ActionResult Edit(my m)//my实体类 { testEntities t = new testEntities();//数据库上下文 t.my.Attac ...

  8. ueditor1_4_3_3编辑器修改文章

    html的body中: <script id="editor" type="text/plain" ></script> js中: // ...

  9. logging.xml file setfile(null,true) call failed

    定义目录三个方法:一:${catalina.base}或${catalina.home}相对路径配置方法.catalina.home是你配置服务器时自动在环境变量中加的路径,默认是指向tomcat服务 ...

  10. mysql数据库中的存储引擎是什么意思呢

    需求描述: 在看mysql的内容,经常提到存储引擎,那么到底什么是存储引擎呢 在这里对于概念进行理解,记录下. 概念解释: 存储引擎(storage engine):存储引擎就是mysql中的一个组件 ...