• 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>
  • 相关阅读:
    关于websocket
    Convert word or html to wiki syntax
    How to center an image?
    Multiline strings in JavaScript
    JavaScript tips and tricks 4
    Use IE userdata behavior as a clientside data storage
    Confused with JavaScript prototype
    Javascript中的作用域(scope)
    JavaScript tips and tricks 2
    AOP in JavaScript
  • 原文地址:https://www.cnblogs.com/yaowen/p/5738500.html
Copyright © 2020-2023  润新知