function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
GraciaGracia 

I want to convert the aura component into the LWC- But in lwc logical conditions are not supported as in Aura.Plz help to convert it to LWC

My Aura Componet code is below----->>I am making lightning form dynamically using custom metadata type----->>"In aura its working fine"

<aura:component implements="forceCommunity:availableForAllPageTypes" access="global" controller="fundRequestWebForm" >
    
    <aura:attribute name="userInfo" type="user"/>  
    <aura:attribute name="totalPageNumber" type="Integer"/>
    <aura:attribute name="currentPageNumber" type="Integer" default="1"/>
    <aura:attribute name ="showForm" type= "Boolean" default="false"/>
    <aura:attribute name ="showPrevious" type= "Boolean" default="false"/>
    <aura:attribute name ="showSave" type= "Boolean" default="false"/>
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <aura:attribute name="hasErr" type="Boolean" default="false"/>
    <aura:attribute name="fundRequestFieldList" type="object" />
    
    <button class="slds-button slds-button_brand" onclick="{!c.showFundRequestForm}" >New Fund Request</button>
    <aura:if isTrue="{!v.showForm}">
        <div class="slds-modal slds-fade-in-open">
            <div class="slds-modal__container">
                <div class="slds-modal__content slds-p-around--medium">
                    <div>
                        <header class="slds-modal__header">
                            <button class="slds-button slds-button_icon slds-modal__close slds-button_icon-inverse" onclick="{!c.handleCancelPopupClick }" title="Close">
                                <lightning:icon iconName="utility:close" alternativeText="Approved" />
                            </button>
                            <h2 class="slds-text-heading_medium slds-hyphenate"> New Partner Fund Request</h2>
                        </header>
                        <aura:iteration items="{!v.fundRequestFieldList}" var="pfr">
                            <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">
                                <aura:if isTrue="{!pfr.formfieldList.Required__c}">
                                    
                                    <span class="slds-required" title="">* </span>
                                </aura:if>
                                
                            </aura:if>
                            
                            <aura:if isTrue="{!pfr.formfieldList.DataType__c=='Text'}">
                                
                                <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">
                                    <lightning:input type="{!pfr.formfieldList.DataType__c}" 
                                                     name="input1" 
                                                     label="{!pfr.formfieldList.Fund_Request_Field_Name__c}" 
                                                     value="{!pfr.formfieldList.Answer__c}" />
                                </aura:if>
                            </aura:if>
                            
                            <aura:if isTrue="{!pfr.formfieldList.DataType__c=='Email'}">
                                
                                <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">
                                    <lightning:input type="{!pfr.formfieldList.DataType__c}" 
                                                     name="input1" 
                                                     label="{!pfr.formfieldList.Fund_Request_Field_Name__c}" 
                                                     value="{!pfr.formfieldList.Answer__c}" />
                                </aura:if>
                            </aura:if>
                            
                            <aura:if isTrue="{!pfr.formfieldList.DataType__c=='Picklist'}">
                                <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">
                                    <lightning:select name="input1" 
                                                      label="{!pfr.formfieldList.Fund_Request_Field_Name__c}"
                                                      >    
                                        <option value="">
                                            --None--
                                        </option>
                                        
                                        <aura:iteration items="{!pfr.picklistvalues}" var="rd">
                                            <option value="{!rd}">
                                                {!rd}
                                            </option>
                                        </aura:iteration> 
                                    </lightning:select>
                                </aura:if>
                            </aura:if>
                            
                            <aura:if isTrue="{!pfr.formfieldList.DataType__c == 'Date'}">
                                <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">
                                    <ui:inputDate value="{!pfr.formfieldList.Answer__c}"  
                                                  displayDatePicker="true" 
                                                  format="MM/dd/yyyy"/>
                                    
                                </aura:if>
                            </aura:if>
                            
                            <aura:if isTrue="{!pfr.formfieldList.DataType__c == 'Currency' || pfr.formfieldList.DataType__c == 'Number'}">
                                <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">
                                    <lightning:input type="number" 
                                                     name="input1" 
                                                     label="{!pfr.formfieldList.Fund_Request_Field_Name__c}" 
                                                     value="{!pfr.formfieldList.Answer__c}" />
                                    
                                </aura:if>
                            </aura:if>
                            
                            <aura:if isTrue="{!and(pfr.formfieldList.DataType__c=='Lookup', pfr.formfieldList.Fund_Request_Field_Name__c=='Partner Account TIBCO Contact')}">
                                <aura:if isTrue="{!v.currentPageNumber==pfr.formfieldList.Page_Number__c}">   
                                    <lightning:input type="{!pfr.formfieldList.DataType__c}" 
                                                     name="input11" 
                                                     label="{!pfr.formfieldList.Fund_Request_Field_Name__c}" 
                                                     value="{!v.userInfo.Name}"
                                                     disabled="true"/>
                                    
                                </aura:if>
                            </aura:if>
                        </aura:iteration>
                        
                        <footer class="slds-modal__footer">
                            <lightning:button label="Cancel" title="Cancel" onclick="{! c.handleCancelPopupClick }"/>
                            
                            <aura:if isTrue="{!v.showPrevious}">  
                                <lightning:button variant="brand" label="Previous" title="Previous" onclick="{! c.handlePreviousClick }" />
                            </aura:if>
                            
                            <aura:if isTrue="{!v.showSave}">  
                                
                                <lightning:button variant="brand" label="Save" title="Save" onclick="{! c.handlesavetClick }" />
                                <aura:set attribute="else">
                                    <lightning:button variant="brand" label="Next" title="Next" onclick="{! c.handleNextClick }" />
                                </aura:set>
                                
                            </aura:if>
                            
                        </footer>       
                        
                    </div>
                </div>
            </div>
        </div>
        
        
    </aura:if>
    
</aura:component>
Nisar AhmadNisar Ahmad
Use the getter function for LWC logical cases.

For example ( pseudo code )

HTML:
<template if:true={isShowForm}>
	
	<template if:true={datatypeIsEmail}>
		<!-- if Datatype is Email -->
	</template>

	<template if:true={datatypeIsPicklist}>
		<!-- if Datatype is Picklist -->
	</template>

</template>
JavaScript:
isShowForm = true;

get datatypeIsEmail(){
	return pfr.formfieldList.DataType__c == 'Email' ? true : false;
}

get datatypeIsPicklist(){
	return pfr.formfieldList.DataType__c == 'Picklist' ? true : false;
}

Thank You
- Nisar Ahmad
 
GraciaGracia
I want to apply pagination also for the same ...like from the backend page number is coming in the list i.e.pagenumber__c and total pages also coming in different list..could u please help me how to display using pagination..like I want to display..if pagenumber==current page numbr then only show and on the click of next I am increasing the current page number value to show the fields for the next page
GraciaGracia
handleNextClick: function( component, event, helper ){ var totalpages = component.get("v.totalPageNumber"); var pageNumber = component.get("v.currentPageNumber"); if(totalpages==pageNumber+1){ component.set("v.showSave", true); } else{ component.set("v.showSave", false); } if(pageNumber>0){ component.set("v.showPrevious", true); } else{ component.set("v.showPrevious", false); } component.set("v.currentPageNumber", pageNumber+1); }, handlePreviousClick: function( component, event, helper ){ var totalpages = component.get("v.totalPageNumber"); var pageNumber = component.get("v.currentPageNumber"); if(totalpages==pageNumber){ component.set("v.showSave", false); } if(pageNumber>2){ component.set("v.showPrevious", true); } else{ component.set("v.showPrevious", false); } component.set("v.currentPageNumber", pageNumber-1); } }) This is the aura controller..I hope u will get it whaterver M trying to say. [image: image.png]