Expand and collapse a dropdown in lightning aura

Question

I am trying to expand and collapse a dropdown section. On Click of button, I am calling a new page and also expanding the section. While I write a condition for collapse, it does not work. I feel my approach is not accurate. Kindly help.

Component:

[<aura:if isTrue="{!v.isShowDRopDown }">
    <lightning:layout >
        <lightning:layoutItem  class="tabFixWidth" >
            <lightning:layoutItem  >
                <lightning:button  aura:id="fAQ" label="faq" onclick="{!c.getKnowledgeFAQData}" class="cstm-subbutton1 cstm-act-subtab">
                    <aura:if isTrue="{!v.isShowText}">
                        <lightning:formattedText value="FAQ &amp; How-To" class="slds-p-around_x-small"/>
                    </aura:if>
                    <aura:if isTrue="{!v.sActiveSubTab=='fAQ'}">
                        <img src="{!$Resource.LR_Portal_Resources +'/pointer.svg'}" class="cstm-tee"/> <!--White-->
                    </aura:if>
                </lightning:button> ]

Controller:

[ if(withoutLastChunk == 'knowledge'){
     component.set("v.isShowKowledge", true);
     component.set("v.sActiveTab", 'Knowledge');
     component.set("v.isShowDRopDown", true);
     component.set("v.sActiveSubTab", 'fAQ');
     component.set("v.customKnowledge", 'cstm-act');
  }
  getKnowledgeFAQData : function(component, event, helper) {
     helper.navigationHelper(component, event, helper, 'knowledge');
  }]

Answer 1

First and foremost, is this copied from your actual source code? Because if so, the first place you should be looking is at your variables and their names' spelling and casing.

For example, v.isShowKowledge and v.isShowDRopDown. Unless you also made the same typo/casing-weirdness in your component's attribute names, I'd be looking there first.