代码下载: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. bat 处理adb脚本

    @echo off REM Funtion: 测试parsermode 接口CdxParserGetMediaInfo 和CdxParserRead REM Code by lzp 2017-05-0 ...

  2. 【转】iTween for Unity

    http://www.cnblogs.com/zhaoqingqing/p/3833321.html?utm_source=tuicool&utm_medium=referral 你曾经在你的 ...

  3. 【bzoj2789】[Poi2012]Letters 树状数组求逆序对

    题目描述 给出两个长度相同且由大写英文字母组成的字符串A.B,保证A和B中每种字母出现的次数相同. 现在每次可以交换A中相邻两个字符,求最少需要交换多少次可以使得A变成B. 输入 第一行一个正整数n ...

  4. linux系统初始化——inittab文件解析

    inittab文件解析 inittab配置文件每行的基本格式如下. id:runlevels:action:process 其中某些部分可以为空,下面我们逐一介绍. 1.id 1-2个字符,配置行的唯 ...

  5. vue使用stylus

    在package.json中添加  stylus-loader "css-loader": "^0.28.0", "stylus-loader&quo ...

  6. mac python 安装参考

    首先需明确: Mac 电脑上自带有 python 查看默认的 python 版本,打开终端输入命令 python,即可看到如下内容: 我的系统版本OS X 10.13.2,自带的Python版本是2. ...

  7. 练习题 求a[i]到a[j]累积和为最大的部分

    原文发布时间为:2009-03-09 -- 来源于本人的百度文章 [由搬家工具导入] 1、有一个数组a[n],里面的数只有两种:-1或1。i,j是两个整数,假设0<=i<=j<=n- ...

  8. 【Visual Studio】无法打开包括文件:“SDKDDKVer.h”

    解决办法是在头文件的搜索目录中添加$(WindowsSDK_IncludePath);,同时在库文件的搜索目录中添加$(WindowsSDK_LibraryPath_x86);

  9. hdu 4530(数学)

    小Q系列故事——大笨钟 Time Limit: 600/200 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Others)Total S ...

  10. LeetCode OJ-- Container With Most Water

    https://oj.leetcode.com/problems/container-with-most-water/ 不同高度的柱子排一列,两个柱子可以组成一个容器,求最大容积. 最直观的方法就是暴 ...