Value Providers

For Components

• v for view

  • A component’s attribute set. This value provider enables you to access the value of a component’s attribute in the component’s markup.

       {!v.greeting}
    

• c for controller

  • A component’s controller, which enables you to wire up event handlers and actions for the component

      {!c.getNewGreeting}
    

Global Value Providers

• globalID

  • Returns the global ID for a component
  • Every component has a unique globalId, which is the generated runtime-unique ID of the component instance.

• $Browser

  • Returns information about the hardware and operating system of the browser accessing the application.

    <aura:component>
    {!$Browser.isTablet}
    {!$Browser.isPhone}
    {!$Browser.isAndroid}
    {!$Browser.formFactor}
    </aura:component>
    

  • client-side controller using $A.get()

    ({
    checkBrowser: function(component) {
      var device = $A.get("$Browser.formFactor");
      alert("You are using a " + device);
    }
    })
    

• $Locale

  • Returns information about the current user’s preferred locale

    <aura:component>
      {!$Locale.language}
      {!$Locale.timezone}
      {!$Locale.numberFormat}
      {!$Locale.currencyFormat}
    </aura:component>
    

  • client-side controller using $A.get()

({
       checkDevice: function(component) {
            var locale = $A.get("$Locale.language");
            alert("You are using " + locale);
        }
})

• $Resource

  • lets you reference images, style sheets, and JavaScript code you’ve uploaded in static resource

  • $Resource isn’t available until the Lightning Component framework is loaded on the client

    <aura:component>
      <!-- Stand-alone static resources -->
      <img src="{!$Resource.generic_profile_svg}"/>
      <img src="{!$Resource.yourNamespace__generic_profile_svg}"/>
      <!-- Asset from an archive static resource -->
      <img src="{!$Resource.SLDSv2 + '/assets/images/avatar1.jpg'}"/>
      <img src="{!$Resource.yourNamespace__SLDSv2 + '/assets/images/avatar1.jpg'}"/>
    </aura:component>
    

    ({
      profileUrl: function(component) {
          var profUrl = $A.get('$Resource.SLDSv2') + '/assets/images/avatar1.jpg';
          alert("Profile URL: " + profUrl);
      }
    })