この文章は Salesforce 機械翻訳システムを使用して翻訳されました。詳細はこちらをご参照ください。

ui:outputCurrency

通貨をデフォルトまたは指定形式 (特定の通貨コードまたは小数点の使用など) で表示します。

ui:outputCurrency コンポーネントは、数値を HTML span タグでラップされた通貨として表します。このコンポーネントは、数値を通貨として取り込む ui:inputCurrency と共に使用できます。通貨を表示する場合、属性値を使用して ui:outputCurrency コンポーネントにバインドできます。

1<aura:attribute name="myCurr" type="Decimal" default="50000"/>
2<ui:outputCurrency aura:id="curr" value="{!v.myCurr}"/>

前の例によって次の HTML が表示されます。

1<span class="uiOutputCurrency">$50,000.00</span>

ブラウザのロケールを上書きするには、currencySymbol 属性を使用します。

1<aura:attribute name="myCurr" type="Decimal" default="50" currencySymbol="£"/>

形式を指定して上書きすることもできます。

1var curr = cmp.find("curr");
2curr.set("v.format", '£#,###.00');

次の例は、ui:inputCurrency コンポーネントのデータをバインドする方法を示します。

1<aura:component>
2    <ui:inputCurrency aura:id="amount" label="Amount" class="field" value="50"/>
3    <ui:button class="btn" label="Submit" press="{!c.setOutput}"/> 
4
5 <div aura:id="msg" class="hide">
6  You entered: <ui:outputCurrency aura:id="oCurrency" value=""/>
7 </div>
8</aura:component>

1swfobject.registerObject("clippy.codeblock-5", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17({
18	 setOutput : function(component, event, helper) {
19		var el = component.find("msg");
20	    $A.util.removeClass(el.getElement(), 'hide');
21	    	
22        var amount = component.find("amount").get("v.value");
23        var oCurrency = component.find("oCurrency");
24        oCurrency.set("v.value", amount);
25	 }
26})

属性

属性名	属性型	説明	必須項目
`body`	Component[]	コンポーネントのボディ。マークアップでは、これはタグのボディに含まれるすべてを指します。
`class`	String	コンポーネントに添付される CSS スタイル。このスタイルは、コンポーネントで出力される基本スタイルに追加されます。
`currencyCode`	String	文字列として指定された ISO 4217 通貨コード (「USD」など)。
`currencySymbol`	String	文字列として指定された通貨記号。
`format`	String	数値の形式。たとえば、format=“.00” は、小数点以下 2 桁の数値を表示します。指定されない場合は、ブラウザのロケールに基づくデフォルトの形式が使用されます。
`value`	BigDecimal	Decimal 型で定義された通貨の出力値。	はい

イベント

イベント名	イベントタイプ	説明
`mouseup`	COMPONENT	ユーザがマウスボタンを放したことを示します。
`mousedown`	COMPONENT	ユーザがマウスキーを押したことを示します。
`mousemove`	COMPONENT	ユーザがマウスポインタを移動したことを示します。
`dblclick`	COMPONENT	コンポーネントがダブルクリックされたことを示します。
`mouseout`	COMPONENT	ユーザがマウスポインタをコンポーネントから移動したことを示します。
`click`	COMPONENT	コンポーネントがクリックされたことを示します。
`mouseover`	COMPONENT	ユーザがマウスポインタをコンポーネントに移動したことを示します。

Lightning コンポーネント開発者ガイド

ui:outputCurrency

属性

イベント