How to use global value providers?

Global Value Providers: Salesforce has provided some global value providers to be used in Lightning Component expressions. So, you don’t need to write your own methods to take the Browser Information, Custom Labels etc..

Global Value ProviderFeatureSyntax
$LabelYou can access custom labels using this global value provider in your Lightning Component component/app(.cmp/.app) file

in controller/helper.js/ any js file

if your organization has a namespace, please replace "c" with the namespace just like
{!$Label.namespace.labelName}  -- optional, you can refer "c" or "namespace" in cmp files.
$A.get("$Label.namespace.labelName") -- required to replace the namespace in JS files.
$Browser It provides the hardware and operating system of the browser accessing the component/app(.cmp/.app) file

{!$Browser.formFactor} => returns DESKTOP/PHONE/TABLET as enum value

in controller/helper.js/any js file

$ResourceIt is used to reference images, script files, style sheets and other files fro Static Resource$Resource is not downloaded until Lightning Component framework is loaded on the client side. To make sure, all files are loaded used rerender function.
in component/app(.cmp/.app) for taking image files
< !-- Standalone Image Files -- >
< img src="{!$Resource.imageName}" />
< img src="{!$Resource.namespace__imageName}" />

< !-- Archived Image Files -- >
< img src="{!$Resource.archivedImageFile + '/images/image1.jpg'}" />
< img src="{!$Resource.namespace__archivedImageFile + '/images/image1.jpg'}" />

in component/app(.cmp/.app) for taking Styles and Scripts files
scripts="{!$Resource.archivedScriptFile + '/samplescript.js'}"
afterScriptsLoaded="{!c.scriptsLoaded}" />

in controller/helper.js/any js file
$A.get('$Resource.archivedImageFile ') + '/images/image1.jpg'

Multiple files loaded into component at a same time. Need to use 'join' statement
scripts="{!join(' ,' , $Resource.archivedStyleFile + '/style1.js',
$Resource.archivedStyleFile + '/style2.js')}"

Manage Package Consideration
Static Resource Files are not automatically added into the package if it is referenced in JS files. You need to include the Static Resource Files manually into the package component list prior to upload.
$LocaleIt returns current user's locale component/app(.cmp/.app) file

in controller/helper.js/any js file

Some Important Locale Attributes

country                           returns ISO 3166 Code                                     "US", "GB"
currency                         returns Symbol                                                    "$"
currencyCode              returns ISO 4217 Code                                      "USD"
language                        returns language Code                                     "en"
timeZone                       returns timezone Id                                            "America/Los_Angeles"
dateFormat                   returns dateformat                                             "MMM d, yyyy"
timeFormat                   returns timeformat                                             "h:mm:ss a"

7,741 total views, 3 views today

Rating: 5.0/5. From 1 vote.
Please wait...
This entry was posted in Lightning Components, Salesforce Lightning. Bookmark the permalink.

Leave a Reply