Latest web development tutorials

AngularJSフィルタ

表現や説明書に追加する|()フィルタは、パイプ文字を使用することができます。


AngularJSフィルタ

AngularJSフィルタは、データを変換するために使用することができます。

フィルタ 説明
通貨 通貨としてフォーマット形式番号。
フィルタ 配列からアイテムのサブセットを選択します。
小文字 小文字にフォーマット文字列。
ORDERBY 式に従ってアレイ配置。
大文字の 大文字にフォーマット文字列。

フィルタ式を追加します。

パイプ文字(|)を通して濾過し、フィルター式に追加されます。 。

((二つの例以下に、我々は)前節に述べた人のコントローラを使用します)

大文字としてフォーマット大文字のフィルタ文字列:

AngularJS例

<DIV ngのアプリ= "て、myApp " NG-コントローラ= "personCtrl">

<P>の名前は{{lastNameの|大文字}} < / P>

</ DIV>

»をお試しください

小文字の文字列の書式設定に小文字のフィルタ:

AngularJS例

<DIV ngのアプリ= "て、myApp " NG-コントローラ= "personCtrl">

<P>名前です{{lastNameの|小文字}} < / P>

</ DIV>

»をお試しください

通貨フィルタ

通貨デジタルフィルタは、通貨形式としてフォーマットされます。

AngularJS例

<DIV ngのアプリ= "て、myApp " NG-コントローラ= "costCtrl">

<入力タイプ= "数" NG -model = "量">
<入力タイプ= "数" NG -model =「価格」>

<P>合計価格= {{(数量*価格) |通貨}} </ P>

</ DIV>

»をお試しください

命令にフィルタを追加します。

パイプ文字(|)を通して濾過し、フィルターは、ディレクティブに追加されます。

式に従ってORDERBYフィルタアレイ構成:

AngularJS例

<DIV ngのアプリ= "て、myApp " NG-コントローラ= "namesCtrl">

<UL>
<李NG・リピート= "X名で| ORDERBY: '国'">
{{X.name + '、' + x.country}}
</李>
</ UL>

<DIV>

»をお試しください

フィルタ入力

パイプ文字(|)を介して、入力フィルタ、およびフィルタは、ディレクティブにコロンとモデル名に続いてフィルタを追加されます。

フィルタフィルタアレイからのサブセットを選択します:

AngularJS例

<DIV ngのアプリ= "て、myApp " NG-コントローラ= "namesCtrl">

<P>の<input type = "テキスト" NG-モデル= "テスト"> </ P>

<UL>
<李NG・リピート= "X名で|フィルター:テスト| ORDERBY: '国'">
{{(X.name |大文字)+ '、' + x.country}}
</李>
</ UL>

</ DIV>

»をお試しください