代码下载:https://files.cnblogs.com/files/xiandedanteng/angularJSFilter.rar

显示效果:

页面代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html ng-app="notesApp">
 <head>
  <title> New Document </title>
  <style>
    .bluetext{
        color:blue;
    }
  </style>
    <meta charset="gbk">
    <script src="angular1.4.6.min.js"></script>
 </head>

 <body ng-controller="MainCtrl as ctrl">
    <p>Hi,I am <span class="bluetext" ng-bind="ctrl.user.name|uppercase"></span> .Everyone like to call me <span  class="bluetext" ng-bind="ctrl.user.shortname|lowercase"></span></p>
    <p>I have <span  class="bluetext" ng-bind="ctrl.user.fans|number"></span> fans around the world.</p>
    <p>I can bring you <span  class="bluetext" ng-bind="ctrl.user.money|currency"></span> </p>
    <p>Now it is <span  class="bluetext" ng-bind="ctrl.user.time|date:'medium'"></span>,date is <span  class="bluetext" ng-bind="ctrl.user.time|date "></span>.</p>
 </body>
</html>
<script type="text/javascript">
<!--
    angular.module('notesApp',[])
     .controller('MainCtrl',[function(){
       var self=this;

       self.user={name:"Angular JavaScript",shortname:"AglJS",fans:123456789,money:9087564312};
       self.user.time=new Date().getTime();
     }]);
//-->
</script>

AngularJS的过滤器示例的更多相关文章

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

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

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

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

  3. AngularJS之过滤器

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

  4. 走进AngularJs(七) 过滤器(filter)

    过滤器(filter)正如其名,作用就是接收一个输入,通过某个规则进行处理,然后返回处理后的结果.主要用在数据的格式化上,例如获取一个数组中的子集,对数组中的元素进行排序等.ng内置了一些过滤器,它们 ...

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

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

  6. 前端MVC学习总结(四)——NodeJS+MongoDB+AngularJS+Bootstrap书店示例

    这章的目的是为了把前面所学习的内容整合一下,这个示例完成一个简单图书管理模块,因为中间需要使用到Bootstrap这里先介绍Bootstrap. 示例名称:天狗书店 功能:完成前后端分离的图书管理功能 ...

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

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

  8. angularJS自定义过滤器、服务和指令

    自定义过滤器 mainApp.filter('mayfilter',function(){ return function(input){ (过滤逻辑代码) } });   自定义创建指令 mainA ...

  9. 接近带给你AngularJS - 经验说明示例

    接近带给你AngularJS列: 带你走近AngularJS - 基本功能介绍 带你走近AngularJS - 体验指令实例 带你走近AngularJS - 创建自己定义指令 ------------ ...

随机推荐

  1. iptables端口转发命令

    需求很简单,把本地81端口映射到8080端口上 1. 所有的81请求转发到了8080上.   1 # iptables -t nat -A PREROUTING -p tcp --dport 81 - ...

  2. Groovy安装

    进入Groovy的官网下载安装SDKMAN() 以下是官网的下载方法(http://www.groovy-lang.org/download.html) This tool makes install ...

  3. AngularJs 特性 之 模块化

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. C#的一些基本问题

    静态类和静态变量静态类的定义:static class 类名 静态方法和变量必须使用类名来引用,而不能使用实例化后的对象,因为,静态变量不属于任何实例,而是共有的. 非静态类里面既可以定义静态方法也可 ...

  5. [atcoder002E] Candy Piles [博弈论]

    题面: 传送门 思路: 每一堆糖排成一列,所有列横着放,形成一个阶梯型 两个决策相当于左边一列去掉和最下面一行去掉 那么这个模型可以转化为同样形状的网格图,向左上方走,走到边界的赢· 然后一波数学推导 ...

  6. transform总结

    1. 用jquery的css方法获取transform得到的是矩阵matrix,不利于获取translate的值, 优先使用dom.style.webKitTransform进行transform的读 ...

  7. C语言位运算符:与、或、异或、取反、左移与右移详细介绍

    位运算是指按二进制进行的运算.在系统软件中,常常需要处理二进制位的问题.C语言提供了6个位操作运算符.这些运算符只能用于整型操作数,即只能用于带符号或无符号的char,short,int与long类型 ...

  8. 提高Java开发效率,Idea必装的几款插件

    1.codeMaker 重复代码生成工具 domian和dto两个类基本差不多,这个工具就可以通过一个类快速生成另一个类. 2.gsonFormat json转换成Java类 很多时候根据别人接口给的 ...

  9. Codevs 1993 草地排水

    1993 草地排水 时间限制: 2 s 空间限制: 256000 KB 题目等级 : 钻石 Diamond 题目描述 Description 在农夫约翰的农场上,每逢下雨,Bessie最喜欢的三叶草地 ...

  10. Mongoose 参考手册

    转自:https://cnodejs.org/topic/548e54d157fd3ae46b233502 Mongoose 是什么? 一般我们不直接用MongoDB的函数来操作MongoDB数据库 ...