AngularJSのもう1つの機能は、UNIXの下でパイプラインを操作することでデータ結果を操作できるフィルターを提供することです。
パイプラインを使用することにより、双方向データバインディングのビューの表示を促進できます。
処理中、フィルターはデータを新しい形式に変換し、パイプラインのチェーンスタイルを使用して追加のパラメーターを受け入れることができます。
実装方法
フィルターを定義して宣言する方法を見てみましょう。まず、独自のモジュールmyAppmoduleを作成する必要があります
var myAppmodule = agular.module( "myApp"、[]);
次に、モジュールに基づいて、フィルターを作成します。
myAppModule.filter( "Reverse"、function(){
});
ここで、逆のフィルターの名前が続き、その後にフィルターのメソッド宣言が続き、メソッドで別のメソッドが返されます。
myAppmodule.filter( "Reverse"、function(){return function(input、appercase){var i = 0; i <input.length.length; i ++){out = input.charat(i)+out;} if(uppercase){out = out.touppercase();} return;};};};内部返却されたメソッドには2つのパラメーターが含まれています。1つは入力値です。これは、フィルターで受け入れられている値です。
次のフィルターを実装したい場合:
名前|逆行する
次に、入力は名前で表される値です。
次のパラメーターはオプションです。ここでは、大文字のブール値を受け入れ、ケース変換を実行するかどうかを決定します。
内部コードを説明する必要はありません。最後に、フィルタリングされた文字列を返します。
プログラムサンプル
<!doctype html> <html ng-app = "myapp"> <head> <meta http-equiv = "content-type" content = "text /html; charset = utf-8" /> <スクリプトsrc = "http://apps.bdimg.com/libs/angular.js/1.2.16/angular.min.js"> </script> </head> <body> <div ng-controller = "myappctrl"> name:{{name}} <br> reverse {name | name | Reverse}} <br> reverse&大文字の名前:{{name |逆:true}} </div> <script type = "text/javascript"> var myappmodule = angular.module( "myApp"、[]); myAppModule.Controller( "myAppctrl"、["$ scope"、function($ scope){$ scope.name = "xingoo";}]); myAppmodule.filter( "Reverse"、function(){return function(input、appercase){var i = 0; i <input.length.length; i ++){out = input.charat(i)+out;} if(uppercase){out = out.touppercase();} return;};};}; </script> </body> </html>実行結果
上記は、AngularJSカスタムフィルターに関する情報のコレクションです。今後も関連情報を追加し続けます。このサイトへのご支援ありがとうございます!