Lightning Components Developer Guide

What is the Lightning Component Framework?
Quick Start
Creating Components
Create Lightning Components in the Developer Console
Component Markup
Component Namespace
Component Bundles
Component IDs
HTML in Components
CSS in Components
Component Attributes
Component Composition
Component Body
Component Facets
Best Practices for Conditional Markup
Component Versioning
Using Expressions
Using Labels
Localization
Providing Component Documentation
Working with Base Lightning Components
Working with UI Components
Supporting Accessibility
Using Components
Communicating with Events
Creating Apps
Debugging
Fixing Performance Warnings
Reference
PDF

Newer Version Available

This content describes an older version of this product. View Latest

Localization

The framework provides client-side localization support on input and output components.

The following example shows how you can override the default timezone attribute. The output displays the time in the format hh:mm by default.

The component renders as Oct 7, 2013 2:17:08 AM.

To customize the date and time formatting, we recommend using lightning:formattedDateTime. This example sets the date and time using the init handler.

This example creates a JavaScript Date instance, which is rendered in the format MMM DD, YYYY HH:MM:SS AM.

Although the output for this example is similar to <ui:outputDateTime value="{!v.datetime}" timezone="Europe/Berlin" />, the attributes on lightning:formattedDateTime enable you to control formatting at a granular level. For example, you can display the date using the MM/DD/YYYY format.

For more information, see lightning:formattedDateTime (Beta) and ui:outputDateTime.

Note

Additionally, you can use the global value provider, $Locale, to obtain the locale information. The locale settings in your organization overrides the browser’s locale information.

Working with Locale Information

In a single currency organization, Salesforce administrators set the currency locale, default language, default locale, and default time zone for their organizations. Users can set their individual language, locale, and time zone on their personal settings pages.

Single language organizations cannot change their language, although they can change their locale.

Note

For example, setting the time zone on the Language & Time Zone page to (GMT+02:00) returns 28.09.2015 09:00:00 when you run the following code.

Running $A.get("$Locale.timezone") returns the time zone name, for example, Europe/Paris. For more information, see "Supported Time Zones" in the Salesforce Help.

Setting the currency locale on the Company Information page to Japanese (Japan) - JPY returns ¥100,000 when you run the following code.

To change between using the currency symbol, code, or name, use lightning:formattedNumber instead. For more information, see lightning:formattedNumber (Beta).

Note

Similarly, running $A.get("$Locale.currency") returns "¥" when your org’s currency locale is set to Japanese (Japan) - JPY. For more information, see "Supported Currencies" in the Salesforce Help.