SALESFORCE LIGHTNING AURA : IF

In previous EPISODE we have discussed how to use salesforce lightning expression.
In this episode, are gonna discuss how to use conditional statement in salesforce lightning.
Just like any other programming language where we use if-else statement, In lightning component also we can use the same way with little different syntax.

Let's understand the aura: if syntax with the following example :

Syntax :

=============================================

<aura:if isTrue="{!v.valueOfAttribute}">

/*What to do if true

<aura:set attribute="else">

/*Else part here

</aura:set>

</aura:if>

=============================================

As you can observe in above code <aura:if isTrue define if condition for {!v.valueOfAttribute}.

So when the value of this attribute is true then it will perform the true part.

Then if its value is not true, it will go to else part.

The code is written inside <aura:set attribute="else"> is else part of the code.
Relax !! now, this is just syntax.

Let's cook this recipe by creating a lightning component.

Lightning Component : ifElse.com

=============================================

<aura:component>

<aura:attribute name="edit"

type="Boolean"

default="True"/>

<aura:if isTrue="{!v.edit}">

<ui:button label="submit"/>

<aura:set attribute="else">

Hello, Welcome to SalesfrceKid Platform

</aura:set>

</aura:if>

</aura:component>

=============================================

Now, Let's create a lightning application and add this component to preview the output.

Lightning Application :

=============================================

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

<c:ifElse/>

</aura:application>

=============================================

Now hit on preview button to see output of the above lightning component.

Output :

=============================================

=============================================

Cool !! as the default value of attribute v.edit is true hence it will display true part i.e. submit button.

You can also try else part by changing the default value of the above lightning component.

WOHOOO !! YOU HAVE JUST COMPLETED LIGHTNING AURA: IF EPISODE
If you like this salesforcekid learning platform please let me know in the Comment section...Also, Share with your salesforce folks wish you
Happy learning ☁️⚡️ (Learn. Help. Share.)

<< PREVIOUS NEXT >>