Lightning Component Basics: Add Two Numbers

In this post we are going to learn what is Attributes in Lightning Component and how to use it in components.

Attributes: Lightning Component Attributes are like  member variables in apex class.

syntax: <aura:attribute name=" " type=" " default=" " />
 here name and type are required.

ex: <aura:attribute name="Salesforce" type="String"  />


<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
<aura:attribute name="Number1" type="Integer" default="20" />
        <aura:attribute name="Number2" type="Integer" default="30" />
        <aura:attribute name="Sum" type="Integer" />
    <br/> <br />
    <ui:button label="Click Here" press="{!c.add}" />


add : function(component) {
        var add2=component.get("v.Number1")+component.get("v.Number2");


<aura:application >

when we click button Java script function get called and will set the value to {!v.Sum}

Post a Comment