Angular学習ノートのangularの$filterサービスの浅い分析
1171 ワード
まず、$filterサービスについて説明します.
1、$filterはデータのフォーマットを行うための専用サービスである.
2、AngularJSはcurrency、date、filter、json、limitTo、lowercase、uppercase、number、orderByの8つのfilterを内蔵している.
3、filterはネストして使用することができて、パイプの記号"|"で区切ることができます(linuxに似ています);
4、filterはパラメータを渡すことができる.
5、ユーザーはfilterをカスタマイズすることができる.
内蔵filterについて説明します.
currency:数値の前に自動的に「$」や「¥」を付けるなど、通貨のフォーマットに使用します.
date:日付をフォーマットし、豊富な日付フォーマットを提供します.
json:jsonフォーマットを完了します.
number:例えば2桁の小数に回転するなど.
orderBy:並べ替えを行います.
フィルタの簡単な使用:
出力:
May 3, 2011 05/03/2011 6:39AM 2011-05-03 06:39:08 $30.00
カスタムフィルタ:
eg:
使用:{'JennyLin'|myFilter}}
以上、angularの$filterサービスについて詳しく紹介しましたが、皆さんに役に立つことを願っています.もし皆さんが何か疑問があれば、私にメッセージを送ってください.編集者はすぐに皆さんに返事します.
1、$filterはデータのフォーマットを行うための専用サービスである.
2、AngularJSはcurrency、date、filter、json、limitTo、lowercase、uppercase、number、orderByの8つのfilterを内蔵している.
3、filterはネストして使用することができて、パイプの記号"|"で区切ることができます(linuxに似ています);
4、filterはパラメータを渡すことができる.
5、ユーザーはfilterをカスタマイズすることができる.
内蔵filterについて説明します.
currency:数値の前に自動的に「$」や「¥」を付けるなど、通貨のフォーマットに使用します.
date:日付をフォーマットし、豊富な日付フォーマットを提供します.
json:jsonフォーマットを完了します.
number:例えば2桁の小数に回転するなど.
orderBy:並べ替えを行います.
フィルタの簡単な使用:
{{ 1304375948024 | date }}
{{ 1304375948024 | date:"MM/dd/yyyy h:mma" }}
{{ 1304375948024 | date:"yyyy-MM-dd hh:mm:ss" }}
{{ 30 | currency }}
出力:
May 3, 2011 05/03/2011 6:39AM 2011-05-03 06:39:08 $30.00
カスタムフィルタ:
eg:
var myModule = angular.module('myModule',[]);
myModule.filter('myFilter',function(){
return function(item){
return 'Hi,'+item;
}
});
使用:{'JennyLin'|myFilter}}
以上、angularの$filterサービスについて詳しく紹介しましたが、皆さんに役に立つことを願っています.もし皆さんが何か疑問があれば、私にメッセージを送ってください.編集者はすぐに皆さんに返事します.