angular的过滤器

来源：互联网发布：死海古卷知乎编辑：程序博客网时间：2024/06/08 01:30

html

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>Document</title>    <script type="text/javascript" src="angular.js"></script>    <script type="text/javascript" src="过滤器.js"></script></head><body ng-app="App">    <div ng-controller="democontroller">        <!-- //数字过滤器，默认会把数字三个三个隔开 1,234,567-->        {{1234567 | number}} <br>        <!-- //数字过滤器，后面的三是保留三个小数 1,234,567.000-->        {{1234567 | number:3}}<br>        <!-- //数字过滤器，数字格式 $1,234,567.00  ,还可以在后面追加-->        {{1234567 | currency | number:3}}<br>        <!-- //数字过滤器，数字格式自定义 ￥1,234,567.00-->        {{1234567 | currency:'￥'}}<br>        <hr>        <!-- "2017-10-03T07:42:31.711Z" -->        默认：{{today}}<br>        <!-- Oct 3, 2017 3:49:44 PM -->        medium:{{today | date:'medium'}}<br>        <!-- 10/3/17 3:49 PM -->        short:{{today | date:'short'}}<br>        <!-- Tuesday, October 3, 2017 -->        fullDate:{{today | date:'fullDate'}}<br>        <!-- October 3, 2017 -->        longDate:{{today | date:'longDate'}}<br>        <!-- Oct 3, 2017 -->        mediumDate:{{today | date:'mediumDate'}}<br>        <!-- 10/3/17 -->        shortDate:{{today | date:'shortDate'}}<br>        <!-- 3:49:44 PM -->        meduiTime:{{today | date:'mediumTime'}}<br>        <!-- 3:49 PM -->        shortTime:{{today | date:'shortTime'}}<br>        <br>        <!-- 2017-10-3 15:59:50 -->        {{today |date: 'y-M-d H:m:s'}}        <hr>        <!-- [2,3,4,5,6] 5表示显示几个数字，1表示从第几个开始-->        {{[1,2,3,4,5,6,7,8,9] | limitTo:5:1}}<br>        <!-- [4,5,6,7,8] 表示从后面开始查-->        {{[1,2,3,4,5,6,7,8,9] | limitTo:-5:-1}}<br>        <!-- HELLO 大小写转换-->        {{'hello' | uppercase}}<br>        <!-- hello -->        {{'HELLO' | lowercase}}<br>        <hr>        <!-- [{"name":"shanghai","age":12}] 过滤包含上海的数据-->        {{data | filter : 'shanghai'}}<br>        <!-- [{"name":"zhengzhou","age":33},{"name":"hangzhou","age":45},{"name":"shanghai","age":122}]    按照age的大小排序 age前面加-号说明是从大到小的顺序排列 -->        {{data | orderBy:'-age' }}<br>        <!-- [{"name":"shanghai","age":122}] -->        {{data | filter: checkName }}<br>    </div>  </body></html>

var app=angular.module("App",[]);app.factory("data",function(){    return [{            name:"shanghai",            age:122            },{            name:"zhengzhou",            age:33            },{            name:"hangzhou",            age:45            }]})app.controller("democontroller",function($scope,data,$filter){    $scope.data=data;    $scope.today=new Date();    /*在js里面如何用过滤器，先注入$filter这个对象，然后后面跟上过滤类型，后面再加上参数，返回一个值*/    var num=$filter("json")(data);    /*console.log(num)*/    自定义过滤器，obj是页面的参数，然后对他进行过滤。ok的话就返回true    $scope.checkName=function(obj){        if(obj.age>50){            return true;        }        return false;    }})

阅读全文

0 0