4

I am writing a new Lightning Component to conditionally render a message based on a few field values. I am close to having the conditions render like I want, but I can't figure out how to write in a not(field_name) type of condition into the aura:if statement.

Since aura:if require isTrue, I need to reverse engineer the condition so that the message displays when isTrue="not(Boolean_Field)

Here's my code. Any suggestions?

<aura:if isTrue="{!v.eventsSimple.Event_Closed__c}">
            <div style="background-color: red; font-weight: bold; color: white;">
                This event is closed.
            </div>
        </aura:if>
        <aura:if isTrue="{!and(not(v.eventsSimple.Event_Closed__c),lessthan(v.eventsSimple.Spots_Remaining__c,1))}">
            <div style="background-color: orange; font-weight: bold; color: black;">
                This event is full but accepting a waitlist. Nominees in queue: <ui:outputText value="{!abs(v.eventsSimple.Spots_Remaining__c)}"/>
            </div>
        <aura:set attribute="else">
                <div style="background-color:green; color: white; font-weight:bold;">
                    This event is available for nomination. Please make sure to review the description and eligibility rules.
                    <br/>
                    Remaining slots: &nbsp; <ui:outputText value="{!v.eventsSimple.Spots_Remaining__c}"/>
                </div>  
            </aura:set>
        </aura:if>

The 2nd aura:if statement is the one in question.

1
  • If v.eventsSimple.Event_Closed__c return boolean, have you tried: <aura:if isTrue="{!and(!v.eventsSimple.Event_Closed__c,lessthan(v.eventsSimple.Spots_Remaining__c,1))}"> Oct 8, 2018 at 14:25

2 Answers 2

3

Why not completely remove the and condition in your second aura:if and do something like so:

<aura:if isTrue="{!v.eventsSimple.Event_Closed__c}">
        <div style="background-color: red; font-weight: bold; color: white;">
            This event is closed.
        </div>
        <aura:set attribute="else">
            <aura:if isTrue="{!lessthan(v.eventsSimple.Spots_Remaining__c,1)}">
                <div style="background-color: orange; font-weight: bold; color: black;">
                    This event is full but accepting a waitlist. Nominees in queue: <ui:outputText value="{!abs(v.eventsSimple.Spots_Remaining__c)}"/>
                </div>
                <aura:set attribute="else">
                    <div style="background-color:green; color: white; font-weight:bold;">
                        This event is available for nomination. Please make sure to review the description and eligibility rules.
                        <br/>
                        Remaining slots: &nbsp; <ui:outputText value="{!v.eventsSimple.Spots_Remaining__c}"/>
                    </div>  
                </aura:set>
            </aura:if>
        </aura:set>
    </aura:if>

I am glad that you got it to work based on @glls lead, but I don't see how your original condition:

<aura:if isTrue="{!and(not(v.eventsSimple.Event_Closed__c),lessthan(v.eventsSimple.Spots_Remaining__c,1))}">

would fail. It should have worked assuming v.eventsSimple.Event_Closed__c returns a Boolean value. If that is the case, FYI, this is also a valid syntax:

<aura:if isTrue="{!and(!v.eventsSimple.Event_Closed__c,lessthan(v.eventsSimple.Spots_Remaining__c,1))}">
0
5

you could use a notequals operator, a quick look at the Expression Functions Reference might shed some light on the approach, but a quick example:

isTrue="{!and(notequals(v.theField, 'some value')...

or equals, if you reverse the logic.

0

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .