欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

AngularJS過濾器filter用法實例分析

 更新時間：2016年11月04日 14:13:35   作者：破狼  
這篇文章主要介紹了AngularJS過濾器filter用法,結(jié)合實例形式分析了過濾器filter的定義與使用技巧,需要的朋友可以參考下

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

這節(jié)我們來看看angularjs的過濾器filter。

在我們開發(fā)中經(jīng)常需要在頁面顯示給用戶的信息需要一定處理格式化，才能顯示給用戶。比如時間本地化，或者yyyy-MM-dd HH:mm:ss格式，數(shù)字精度格式化，本地化，人名格式化等等。在angularjs中為我們提供了叫filter的指令，讓我們能夠很輕易就能做到著一些列的功能，angularjs內(nèi)部為我們提供了number等很多內(nèi)置的filter。并且我們能夠很輕易的自定義自己的領(lǐng)域filter。

如下實例：

html:

<div ng-app="app" ng-controller="test">
num:<input ng-model="num" />
<br/>
{{num | number}}
<br/>
{{num | number:2}}
<br/>
first name:<input ng-model="person.first"/>
<br/>
last name:<input ng-model="person.last"/>
<br/>
name: {{person | fullname}}
  <br/>
name: {{person | fullname:"- -"}}
    <br/>
name: {{person | fullname:" " | uppercase }}
</div>

js:

function test($scope) {
}
angular.module("app", []).controller("test", test).
filter("fullname", function() {
  var filterfun = function(person, sep) {
    sep = sep || " ";
    person = person || {};
    person.first = person.first || "";
    person.last = person.last || "";
    return person.first + sep + person.last;
  };
  return filterfun;
});

​jsfiddle效果：http://jsfiddle.net/whitewolf/uCPPK/9/

在實例中首先演示了angularjs自帶的number的filter使用。再同樣為我們樣式了如何去創(chuàng)建一個angularjs的filter。其實現(xiàn)很簡單.angularjs使得擴展一切變得自然

最后說明：angularjs filters支持鏈式寫法，如何powershell或者其他操作系統(tǒng)外殼語言一樣的管道式模型，形如 value | filter1 | filter2。

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

相關(guān)文章

最新評論