Lightning Components Developer’s Guide
jNewer Version Available
Conditional Expressions
Here are examples of conditional expressions using the ternary operator and the
<aura:if> tag.
Ternary Operator
This expression uses the ternary operator to conditionally output one of two values dependent on a condition.
1swfobject.registerObject("clippy.codeblock-0", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17<a class="{!v.location == '/active' ? 'selected' : ''}" href="#/active">Active</a>The {!v.location == '/active' ? 'selected' : ''} expression conditionally sets the class attribute of an HTML <a> tag, by checking whether the location attribute is set to /active. If true, the expression sets class to selected.
Using <aura:if> for Conditional Markup
This snippet of markup uses the <aura:if> tag to conditionally display an edit button.
1swfobject.registerObject("clippy.codeblock-1", "9");
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17<aura:attribute name="edit" type="Boolean" default="true"/>
18<aura:if isTrue="{!v.edit}">
19 <ui:button label="Edit"/>
20 <aura:set attribute="else">
21 You can’t edit this.
22 </aura:set>
23</aura:if>If the edit attribute is set to true, a ui:button displays. Otherwise, the text in the else attribute displays.