Tuesday, September 4, 2018

Value provider/Action provider in Salesforce Lightning

Value provider is a way to access data,with value provider v we can fetch value of attribute from component markup in javascript controller.Value provider is denoted with v(view) and action provider is denoted with c(controller).

Value provider:

This value provider enable us to access value of component attribute in component markup and javascript controller.


 <aura:attribute type="string" name="myfirstattribute" default="first text"/> 



Action provider:

This enable us to handle actions,event,handlers for the component.

Ex:<aura:handler  name="init" value="{!this}" action="{!c.doinit}"/>

In Javascript controller,


doinit:function(component, event, helper) {

// some operations here



Let's understand with simple example.


Step 1:Build a  lightning component.

<aura:component  >
        <aura:attribute type="string" name="myfirstattribute" default="first text"/>
    Default value of attribute:
    {!v.myfirstattribute} // Value provider 
    <lightning:button label="clickme" onclick="{!c.method1}" />

 // Handling on click event of  button by using c and calling the method of javascript controller.

Note:We are using a string type attribute with default value as "first text",as the component loads we will get value as "first text"and on click on button we are changing the value from "first text" to "Second text".

Step 2: Build a controller.

method1 : function(component, event, helper) {
      var action=  component.get("v.myfirstattribute"); // using value provider in javascript controller to get attribute value.// Note: Use double quote with value  .
        var secondvalue="Second text";
        component.set("v.myfirstattribute",secondvalue); //setting some other value in attribute.


Step 3:Build a lightning app for previewing component.

<aura:application extends="force:slds">

No comments:

Post a Comment