Toggle Side Panel
Close search

Activity › Forums › Salesforce® Discussions › Explain the uses of lightning:formattedNumber in Salesforce.

Tagged: , , ,

  • Avnish Yadav

    Member
    August 21, 2018 at 12:45 PM

    Hi Anjali,

    Displays formatted numbers for decimals, currency, and percentages.

    Example:-

    <aura:component>
    <p><lightning:formattedNumber value="1234.5678"/></p>
    <p><lightning:formattedNumber value="1234.5678" maximumFractionDigits="2"/></p>
    <p><lightning:formattedNumber value="12.34" style="decimal" minimumIntegerDigits="5"/></p>
    <p><lightning:formattedNumber value="12.34" style="decimal" minimumFractionDigits="5"/></p>
    <p><lightning:formattedNumber value="12.34" style="decimal" minimumSignificantDigits="5"/></p>
    <p><lightning:formattedNumber value="123456789.123456789" minimumFractionDigits="9"/></p>
    </aura:component>

    Output:-

    1,234.568

    1,234.57

    00,012.34

    12.34000

    12.340

    123,456,78991

    Thanks.

  • madhulika shah

    Member
    September 6, 2018 at 6:35 AM

    Hi Anjali,

    A lightning:formattedNumber component displays formatted numbers for decimals, currency, and percentages. This component uses the Intl.NumberFormat JavaScript object to format numerical values. The locale set in the app's user preferences determines how numbers are formatted.

    The component has several attributes that specify how number formatting is handled in your app. Among these attributes are minimumSignificantDigits and maximumSignificantDigits. Significant digits refer the accuracy of a number. For example, 1000 has one significant digit, but 1000.0 has five significant digits. Additionally, the number of decimal places can be customized using maximumFractionDigits.

    • Decimal numbers default to 3 decimal places. This example returns 1234.568.

    <aura:component>
    <lightning:formattedNumber value="1234.5678" />
    </aura:component>

    • Currencies default to 2 decimal places. In this example, the formatted number displays as $5,000.00.<aura:component>
      <lightning:formattedNumber value="5000" style="currency" currencyCode="USD" />
      </aura:component>
    • Percentages default to 0 decimal places. In this example, the formatted number displays as 50%.

    <aura:component>
    <lightning:formattedNumber value="0.5" style="percent" />
    </aura:component

     

  • Parul

    Member
    September 21, 2018 at 12:33 PM

    A lightning:formattedNumber component displays formatted numbers for decimals, currency, and percentages. This component uses the Intl.NumberFormat JavaScript object to format numerical values. The locale set in the app’s user preferences determines how numbers are formatted.

    The component has several attributes that specify how number formatting is handled in your app. Among these attributes are minimumSignificantDigits and maximumSignificantDigits. Significant digits refer the accuracy of a number. For example, 1000 has one significant digit, but 1000.0 has five significant digits. Additionally, the number of decimal places can be customized using maximumFractionDigits.

    Decimal numbers default to 3 decimal places. This example returns 1234.568.

     

    Thanks

  • shariq

    Member
    September 21, 2018 at 1:13 PM

    Hi,

    In this example the formatted number displays as $5000.00

    <aura:component>
    <lightning:formattedNumber value="5000" style="currency" currency="USD" />
    </aura:component>
    In this example the formatted number displays as 50%.

    <aura:component>
    <lightning:formattedNumber value="0.5" style="percent" />
    </aura:component>

    Thanks

Log In to reply.

Popular Salesforce Blogs