亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

AngularJS入門教程之過濾器用法示例

 更新時間:2016年11月02日 09:18:24   作者:Rongbo_J  
這篇文章主要介紹了AngularJS過濾器用法,結合實例形式簡單的分析了AngularJS過濾器的功能及基本用法,并舉例說明了自定義過濾器的實現(xiàn)技巧,需要的朋友可以參考下

本文實例講述了AngularJS過濾器用法。分享給大家供大家參考,具體如下:

在前面幾節(jié)里我們已經(jīng)接觸過AngularJS的表達式,表達式的作用是向視圖中輸出字面量或$scope對象中的屬性值。在輸出之前我們可以通過過濾器來格式化輸出的數(shù)據(jù)。

過濾器的使用非常簡單,我們看一下下面的代碼:

<!DOCTYPE html>
<html ng-app>
<head lang="en">
 <meta charset="UTF-8">
 <script type="text/javascript" src="angular-1.3.0.14/angular.js"></script>
 <title>tutorial05_1</title>
</head>
<body>
 <p>{{"HELLO WORLD!"| lowercase}}</p>
 <p>{{"hello world!"| uppercase}}</p>
 <p>{{3.1415926| number:2}}</p>
 <p>{{3011| currency}}</p>
</body>
</html>

兩個嵌套的大括號即為AngularJs的表達式,我們通過|字符后跟上過濾器名稱來調(diào)用該過濾器。lowercase,uppercase,number,currency為AngularJs內(nèi)置的過濾器。

lowercase用來把文本中的字母轉換為小寫,uppercase和它相反,number過濾器用來控制數(shù)字的格式,currency則把數(shù)字轉換成金額格式。

我們看一下在瀏覽器中的效果:

AngularJs提供的內(nèi)置過濾器功能很有限,下面介紹如何自定義過濾器。

<!DOCTYPE html>
<html ng-app="filterMod">
<head lang="en">
 <meta charset="UTF-8">
 <script type="text/javascript" src="angular-1.3.0.14/angular.js"></script>
 <title>tutorial05_2</title>
</head>
<body>
 <p>{{11314| toRMB}}</p>
<script>
 var filterMod = angular.module("filterMod",[]);
 filterMod.filter("toRMB",function($log)
 {
  var toRMB = function(input)
  {
   var RMBNum = ['零',"壹","貳","叁","肆","伍","陸","柒","捌","玖","拾","佰","仟","萬","億"];
   var inputStr = input + "";
   var inputArr = new Array();
   for(i=0;i<inputStr.length;i++)
   {
    var temp = parseInt(input % 10);
    inputArr.push(temp);
    switch(i)
    {
     case 0:inputArr.push(10);
      break;
     case 1:inputArr.push(11);
      break;
     case 2:inputArr.push(12);
      break;
     case 3:inputArr.push(13);
      break;
    }
    input = input / 10;
   }
   inputArr = inputArr.reverse();
   var output = "";
   for(i=0;i<inputArr.length;i++)
   {
    output += RMBNum[inputArr[i]];
   }
   return output;
  }
  return toRMB;
 });
</script>
</body>
</html>

上面是筆者自定義的一個將數(shù)字轉換成人民幣大寫漢字的過濾器。

filterMod.filter("toRMB",function($log)...

過濾器的定義和控制器類似,我們通過AngularJs模塊的filter方法來完成,第一個參數(shù)為過濾器的名稱,第二個參數(shù)為過濾器實現(xiàn)部分,它必須返回一個數(shù)據(jù)處理函數(shù)。

var toRMB = function(input)...

這一部分為數(shù)據(jù)處理函數(shù),input為原始輸入數(shù)據(jù),我們在該函數(shù)中對輸入數(shù)據(jù)進行處理,然后return 處理過后的數(shù)據(jù)即可。

在瀏覽器中效果:

注意:這個toRMB 過濾器只是筆者為了演示自定義過濾器的方法而編寫的,還有很多不足的地方,有興趣的讀者可以自行完善。

AngularJS源碼可點擊此處本站下載。

希望本文所述對大家AngularJS程序設計有所幫助。

相關文章

最新評論