1

Problem. I have a related record to an opportunity and I'm able to get the data from that record to populate successfully on the LWC. I would like to add some checks incase the fields I'm bringing in from that record (Name, Contact, etc.) are blank (e.g. Related record doesn't have a field value display 'NO CONTACT').

I've looked through the LWC Recipes for examples of getters and setters, but all their examples seem to be related to a user setting a value from the UI rather than checking a value returned by a related record. I've pasted a code sample below. BONUS POINTS: Any recommended resources for getters and setters on LWC would be greatly appreciated.

HTML for LWC

    <template>
    <lightning-card title='Payment'>
        <template if:true={record.data}>
        <div class='slds-card'>
            <div class="slds-m-around_medium">
                <span class="slds-form-element__label">Contact</span>
                    <p>{paymentContact}</p>
        </div>
        </template>
    </lightning-card>
</template>

JS for LWC

export default class OppPaymentMethod extends NavigationMixin(LightningElement) {
    @api recordId;
    @track record;
    @track error;
    @track nameTest = 'THIS IS A TEST';


    @wire(getRecord, { recordId: '$recordId', fields: FIELDS })
    record; 

    get paymentContact() {
        return getFieldValue(this.record.data, PAYMENT_CONTACT_NAME_FIELD);

    }
}
2

There are two ways for this.

HTML Way:

I will explain with your wired property record.data. Let's say there's a field Contact_Name__c. You can add checks like below.

<template if:true={record.data.Contact_Name__c}>{record.data.Contact_Name__c}</template>
<template if:false={record.data.Contact_Name__c}>No Contact</template>

You need to add checks in the parent that section if record.data has value or not.


JavaScript Way

Add checks in the getter method and return the result as per conditions.

get paymentContact() {
    let val = getFieldValue(this.record.data, PAYMENT_CONTACT_NAME_FIELD);
    if(val){
        return val;
    }
    return 'No Contact';
}

You can use this directly in the HTML file like {paymentContact}.

Remember setters you need only with public properties. Getters you can use with both public and private.

Getters/Setters

6
  • What if i have multiple fields? Are you suggesting use the Template conditional every field I want to check? – thinker Jan 9 '20 at 15:11
  • 1
    IT WORKED! Thank you. I was lost on the getter and setter, and assumed I had to use a setter to get the result. Didn't realize I could add logic to the getter. – thinker Jan 9 '20 at 15:14
  • 1
    If you have multiple fields then you need to use the javascript approach, Its a very lengthy question to answer here. But in short, what I would do is, I will fill out the values with a message using js and I would render that directly on the HTML in a classical fashion like obj.Field__c. – Rahul Gawale Jan 9 '20 at 15:17
  • Do you have a resource on that? I'm not familiar with the classical fashion.... – thinker Jan 9 '20 at 15:20
  • 1
    I mean if the value is not present in a field I will write the message directly in that field and render that field directly like {object.field}. That way it will get a value at any condition. I will update the answer with this example as well, in some time – Rahul Gawale Jan 9 '20 at 15:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.