function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
JeffreyStevensJeffreyStevens 

LWC fields from oObject html syntax

I have a LWC that is returning an sObject from APEX.  How do you display a field in the HTML?

my .js has... 
import rtnSObjectRec from '@salesforce/apex/HelperAccount.rtnSObjectRec';

The APEX is: 
@AuraEnabled (cacheable=true) 
	public static Account rtnSObjectRec(string recId) {
		Account sObjectRec = [SELECT id,name FROM Account WHERE Id = :recId];
		return sObjectRec;
	}

The HTML is: 
<lightning-formatted-text value={sObjectRec.name.data}></lightning-formatted-text>

But the LWC doesn't display.  If I change the HTML to 
<lightning-formatted-text value="testData"></lightning-formatted-text>
The lwc will display, and the "testData" will show.

Can anybody see what I'm doing wrong?

Thanks,

(I know I can just use the data service to get sObjects, I'm just trying to understand the syntax on the HTML side. Eventually, I want my APEX to return a custom sub-class)


 
Alain CabonAlain Cabon
@JeffreyStevens

 What is your wired method?   There are two forms

import rtnSObjectRec from '@salesforce/apex/HelperAccount.rtnSObjectRec';
@wire(rtnSObjectRec , { recId: '$recId' })
          acc;

https://developer.salesforce.com/docs/component-library/documentation/lwc/lwc.apex

But the display in the template of a field from acc is not direct with just acc.Name. LWC is more verbose.

import NAME_FIELD from '@salesforce/schema/Account.Name';   // one declaration by fied? .... yes, it is verbose.
getFieldValue(this.acc.data, NAME_FIELD)

Complete example: 
<template>
    <lightning-record-view-form
            record-id={recordId}
            object-api-name={accountObject}>
        <div class="slds-grid">
            <div class="slds-col slds-size_1-of-2">
                <!-- Other record data here -->
            </div>
            <div class="slds-col slds-size_1-of-2">
                <lightning-formatted-text value={nameValue}
                    class="slds-text-heading_large">
                </lightning-formatted-text>
            </div>
        </div>
    </lightning-record-view-form>
</template>
  
import { LightningElement, api, wire } from 'lwc';
/* Wire adapter to fetch record data */
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import ACCOUNT_OBJECT from '@salesforce/schema/Account';
import NAME_FIELD from '@salesforce/schema/Account.Name';

export default class AccountViewer extends LightningElement {
     /** Id of record to display. */
    @api recordId;

    /* Expose schema objects/fields to the template. */
    accountObject = ACCOUNT_OBJECT;

    /* Load Account.Name for custom rendering */
    @wire(getRecord, { recordId: '$recordId', fields: [NAME_FIELD] })
    record;

    /** Get the Account.Name value. */
    get nameValue() {
        return this.record.data ? getFieldValue(this.record.data, NAME_FIELD) : '';
    }
}
https://developer.salesforce.com/docs/component-library/documentation/lwc/lwc.data_load_record

There are utility methods getRecord / getFieldValue and finally a getter for just getting the name value of the account.

<lightning-formatted-text value={nameValue} class="slds-text-heading_large"> </lightning-formatted-text>