ui:outputCurrency

ui:outputCurrency コンポーネントは、数値を HTML span タグでラップされた通貨として表します。ui:outputCurrency の代わりに lightning:formattedNumber を使用し、style="currency" を指定すること��お勧めします。

このコンポーネントは、数値を通貨として取り込む ui:inputCurrency と共に使用できます。Lightning Design System のスタイル設定を適用するには、ui:inputCurrency の代わりに lightning:input を使用し、type="number" および formatter="currency" を指定することをお勧めします。

通貨を表示する場合、属性値を使用して 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 コンポーネントのデータをバインドする方法を示します。ui:outputCurrency の代わりに lightning:formattedNumber を使用し、style="currency" を指定することをお勧めします。

1<aura:component>
2    <aura:attribute name="myCurrency" type="integer" default="50"/>
3    <ui:inputCurrency aura:id="amount" label="Amount" class="field" value="{!v.myCurrency}" updateOn="keyup"/>
4 You entered: <ui:outputCurrency value="{!v.myCurrency}"/>
5</aura:component>

属性

イベント