angularjs 过滤器

简介:
复制代码
<!DOCTYPE HTML>
<html ng-app="myApp">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<script src="angular.min.js"></script>
<script>

var m1 = angular.module('myApp',[]);

m1.filter('firstUpper',function(){//自定义过滤器,firstUpper是过滤器名字。
    return function(str,num){
        console.log(num);
        return str.charAt(0).toUpperCase() + str.substring(1);
    }
});

m1.controller('Aaa',['$scope','$filter ',function($scope,$filter){//$filter是过滤器,
    
    $scope.name = '723894734.7489545';
    $scope.name = 'hello';
    $scope.name = {"name":"hello","age":"20"};
    $scope.name = ['a','b','c'];
    $scope.name = '3748935795';
    
    $scope.name = [
        {color:"red",age:"20"},
        {color:"yellow",age:"30"},
        {color:"blue",age:"40"},
        {color:"green",age:"10"}
    ];
    //$filter过滤器要形参传进来,
    $scope.name = $filter('uppercase')('hello');
    $scope.name = $filter('number')('236478234.3647348',1);//数字格式化,保留一位小数。
    $scope.name = $filter('date')('236478234','hh');//毫秒数格式化为小时
    
    $scope.name = 'hello';
    
    $scope.name = $filter('firstUpper')('hello');//使用自定义过滤器
    
}]);

</script>
</head>

<body>
<div ng-controller="Aaa">
    <p>{{name | currency:""}}</p>  //currency是把数字变成金额的写法, ¥是数字前面加¥
    <p>{{ name | number : 2 }}</p>//number是把数字每3位一个逗号,2表示保留2位小数
    <p>{{ name | uppercase }}</p>
    <pre>{{ name | json }}</pre>  //json格式的name转换为json对象,
    <p>{{ name | limitTo : 2 }}</p>
    <p>{{ name | date : 'yyyy' }}</p>  //对毫秒数的name格式化
    <p>{{ name | orderBy : 'age' : true }}</p>
    <p>{{ name | filter : 'l' }}</p>
    <p>{{ name | limitTo : 2 | uppercase }}</p>
    <p>{{ name | firstUpper : 2 }}</p>  使用自定义过滤器,2是参数num.
    <p>{{ name }}</p>
</div>
</body>
</html>
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/5738500.html,如需转载请自行联系原作者

相关文章
|
12月前
angularjs使用过滤器
angularjs使用过滤器
|
Web App开发 JavaScript 前端开发
|
JSON JavaScript 数据格式
|
自然语言处理 JavaScript 前端开发
|
Web App开发 JSON JavaScript