Angular之过滤器

过滤器

　　Angular中有很多内置的过滤器提供给用户使用，并且还可以创建自己的过滤器。

　　在HTML模板中绑定符号{{}} 内通过|调用过滤，如转换大写：{{name | uppercase}}，小数点位数：{{123.45678|number:2}}

　　当然，也可以通过$filter在控制器中进行过滤。如：

 var app=angular.module("myApp",[]);
 app.controller("mycontroler",['$scope','$filter',function($scope,$filter){
     $scope.jsname=$filter('lowercase')('Air Fire')
 }])

　　常用的日期格式，AngularJS定义了一下几种日期格式，默认采用mediumDate的格式

filter过滤器：angularjs中内置了很多过滤器如：字符串过滤器(|filter:'3') 或者 可以用 非“!”。对象过滤器(|filter:{'属性名':'过滤的值'}）。自定义函数。将对象以字符的方式输出(|json)。固定长度截取(|limitTo:截取的长度)。排序orderBy（注意orderBy的第二个参数是用来设定以某种方式排序true/false）。

自定义过滤器：

<!doctype html>
<html>
    <head>
        <script src="http://code.angularjs.org/angular-1.0.1.min.js"></script> 
    </head>
   <body>
    <div ng-app="myApp">
        <div ng-controller='mycontroler'>
             
<input ng-model='name' type='text'  />

<h1> {{ name |lowercase | capitalize  }}</h1>
 
        </div>
     
    </div>
    <script type="text/javascript" src="controller.js"></script>
  </body>
</html>
 var app=angular.module("myApp",[]);
 app.controller('mycontroler',function($scope){
     $scope.name='laisdj jiaJADFJ,ajdfl';
 })
 app.filter('capitalize',function(){
     return function(input){
         //input将是输入的字符
         if(input)
             return input[0].toUpperCase()+input.slice(1);
     }
 })

 

表单验证----待续

 

posted @ 2016-05-19 17:59  2阳  阅读(243)  评论(0)    收藏  举报