<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body ng-app="myApp">

    <div ng-controller="firstController">

        {{name | uppercase}}    <!--转换大写-->

        <br>

        {{name1 | lowercase }}    <!--转换小写-->

        <br>

        {{time | date:"yyyy-MM-dd hh:mm:ss" }}

        <br>

        {{120 | currency}}   <!--美元格式化-->

        {{120 | currency:"￥"}}   <!--中文格式化-->

        <br>

        {{123123123 | number }}    <!--格式化数字-->

        <br>

        {{1.23123123 | number:"1" }}   <!--保留小数点-->

        <br>

        {{[{name:"tanxu",age:11},{name:"张三",age:21},{name:"李四",age:31}] | filter:{name:"张三"} }}   <!--filter过滤-->

        <br>

        {{"我是一个中国人" | limitTo:2 }}    <!--litmitTo截取多少位数-->

        {{"huahuusdf" | limitTo:-2 }}   <!--从后面向前面截取2位-->

        <br>

        {{[{name:"tanxu",age:31},{name:"张三",age:21},{name:"李四",age:11}]  | orderBy :'age'}}  <!--对age进行排序-->

        <!--自定义过滤器的使用-->

        <br>

        {{"hi,tanxu" | myFilter:0:2 }}   <!--传入多个参数-->

        <!--引入外部的模块定义的过滤器,,先引入js文件，再加模块依赖-->

        <br>

        {{"hi,中国" | myFilter1:0:5 }}

    </div>

</body>

<script src="angular/angular.js"></script>

<script src="filter.js"></script>

<script type="text/javascript">

    var app=angular.module("myApp",['filterModule']);

    app.controller('firstController',function($scope,$filter){

        $scope.name="tanxu";

        $scope.name1="TANXU";

        $scope.time="1234234234";

        $scope.name3=$filter('uppercase')($scope.name);  /*利用js的方式去过滤 ，注意：需要注入$filter服务才可以用*/

        console.log($scope.name3);

    });

    /*自定义过滤器---注意：在module中定义*/

    app.filter('myFilter',function(){

        return function(input,n1,n2){

            return input.replace(/hi/,"你好").substring(n1,n2);    /*定义一个自定义的过滤器，实现向替换hi为你好，接着截取n1-n2的字符串进行返回*/

        }

    })

</script>

</html>

在另一个过滤器模块中存放自定义过滤器

/**

 * Created by Administrator on 2016/3/28.

 */

/*将各种过滤器定义为一个模块*/

var filter=angular.module('filterModule',[]);

filter.filter('myFilter1',function(){

    return function(input,n1,n2){

        return input.replace(/hi/,"你好").substring(n1,n2);    /*定义一个自定义的过滤器，实现向替换hi为你好，接着截取n1-n2的字符串进行返回*/

    }

})

　　

ionic准备之angular基础——格式化数据以及过滤器（8）的更多相关文章

  1. ionic准备之angular基础——dom操作相关（6）

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

  2. ionic准备之angular基础———服务provider 和 factory和service（9）

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

  3. ionic准备之angular基础——模板引入（7）

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

  4. ionic准备之angular基础——$watch,$apply,$timeout方法（5）

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

  5. ionic准备之angular基础——run方法（4）

    可以看到整个angular.module对象具有以下各种属性和方法 <!DOCTYPE html> <html lang="en"> <head> ...

  6. ionic准备之angular基础——继承（3）

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

  7. 第214天:Angular 基础概念

    一.Angular 简介 1. 什么是 AngularJS - 一款非常优秀的前端高级 JS 框架 - 最早由 Misko Hevery 等人创建 - 2009 年被 Google 公式收购,用于其多 ...

  8. Angular.js之内置过滤器学习笔记

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

  9. Angular基础---->AngularJS的使用(一)

    AngularJS主要用于构建单页面的Web应用.它通过增加开发人员和常见Web应用开发任务之间的抽象级别,使构建交互式的现代Web应用变得更加简单.今天,我们就开始Angular环境的搭建和第一个实 ...

随机推荐

  1. [bzoj2190][SDOI2008]仪仗队 ——欧拉函数

    题解 以c点为(0, 0)建立坐标系,可以发现, 当(x,y)!=1,即x,y不互素时,(x,y)点一定会被点(x/n, y/n)遮挡. 所以点(x, y)被看到的充分必要条件是Gcd(x, y) = ...

  2. [LeetCode]Word Search 回溯

    Given a 2D board and a word, find if the word exists in the grid. The word can be constructed from l ...

  3. php 计算函数执行时间的方法及获得微妙的方法

    // 获得微妙方法 function getMillisecond() { list($s1, $s2) = explode(' ', microtime()); return (float)spri ...

  4. 【一】ODB - C++ 访问数据库的利器--Hello World On Windows（Version-24）

    本文以MySQL数据库为例,其他数据类似. 官方文档和下载 ODB官方首页    官方开发者说明书(开发教程) 安装下载首页(下载与安装教程Windows/Linux) Windows安装步骤(都是英 ...

  5. spark streaming 异常No output streams registered, so nothing to execute

    实现spark streaming demo时,代码: public static void main (String[] args) { SparkConf conf = new SparkConf ...

  6. C#中一些关键字和罕见类

    1.@ 在处理字符串时,那些个字符串转义字符我们可以使用这个,那@就是为解决这个而诞生的,直接让字符串原样输出有木有?什么sql字符串了,还有路径啥了的,统统搞定 string sql = @&quo ...

  7. 第一章：1-11、在上题的分组交换网中，设报文长度和分组长度分别为x和（p+h）（bit），其中p为分组的数据部分的长度，而h为每个分组所带的控制信息固定长度，与p的大小无关。通信的两端共经过k段链路。链路的数据率为b（bit/s），但传播时延和结点的排队时间均可忽略不计。若打算使总的时延为最小，问分组的数据部分长度p应取为多大？

    <计算机网络>谢希仁著第四版课后习题答案答: 分组个x/p, 传输的总比特数:(p+h)x/p 源发送时延:(p+h)x/pb 最后一个分组经过k-1个分组交换机的转发,中间发送时延:(k ...

  8. [BZOJ1054][HAOI2008]移动玩具 bfs+hash

    1054: [HAOI2008]移动玩具 Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 2432  Solved: 1355[Submit][Stat ...

  9. Ubuntu16.10 +python3.5+Tensorflow 1.1

    1.python版本检查 因为Ubuntu16.10已经默认安装了python2.7 和 3.5,检查python版本, 如果为python2.7,那么就需要我们设置python3.5为默认版本. 查 ...

  10. UVA 1347 Tour 【双调旅行商/DP】

    John Doe, a skilled pilot, enjoys traveling. While on vacation, he rents a small plane and starts vi ...