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
Manish.SinghManish.Singh 

Display Record in LWC

Hi Everyone,
I want to display contact record in LWC but show me error.
 Apex:
 @AuraEnabled(cacheable=true)
    public static contact getContact(string recordId){
        return [SELECT FirstName,LastName,Account.M2BF_Company_Key__c,Email FROM Contact WHERE Id=:recordId];
    }

LWC.js
import { LightningElement, api, track } from 'lwc';
import getContact from '@salesforce/apex/M2BFCreateCoachHandler.getContact';
export default class M2BFRegisterCoachLWC extends LightningElement {
    @api recordId;
    @track contactRec;
    renderedCallback() {
        this.handleload();
    }
    handleload() {
        getContact({ recordId: this.recordId })
            .then(result => {
                alert(JSON.stringify(result));
                this.contactRec = result;
            })
            .catch(error => {
                console.log(error);
            });
    }
}

lwc.html
<lightning-input type="text" data-id="txtFirstName" value={contactRec.FirstName} label="First Name" required="true">
                </lightning-input>

data collected from server side(apex) but while binding in html, it shows undefined.
Please help
Thanks
CharuDuttCharuDutt
Hii Manish 
Try Below Code
LWC

<lightning-input type="text" data-id="txtFirstName" value={val} label="First Name" required="true"></lightning-input>


JS

  @api recordId;
    @track contactRec;
    val;

    connectedCallback() {
        this.handleload();
    }
    handleload() {
        getContact({ recordId: this.recordId })
            .then(result => {
                alert(JSON.stringify(result));
                this.contactRec = result;
                this.val = this.contactRec.FirstName;
            })
            .catch(error => {
                console.log(error);
            });
    }
Please Mark It As Best Answer If It Helps
Thank You!
mukesh guptamukesh gupta
Hi Manish,

If you want to get data from same UI then youu don't need to write a Apex class. please follow below link for more clear

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

if you need any assistanse, Please let me know!!

Kindly mark my solution as the best answer if it helps you.

Thanks
Mukesh 
AbhinavAbhinav (Salesforce Developers) 
Try with @wire 

similar to this:  and then returning field with getter
 
import { LightningElement, api, track, wire } from 'lwc';
import { getRecord } from 'lightning/uiRecordApi';

export default class WireFunction extends LightningElement {
    @api recordId;
    @track record;
    @track error;

    @wire(getRecord, { recordId: '$recordId', fields: ['Account.Name'] })
    wiredAccount({ error, data }) {
        if (data) {
            this.record = data;
            this.error = undefined;
        } else if (error) {
            this.error = error;
            this.record = undefined;
        }
    }
    get name() {
        return this.record.fields.Name.value;
    }
}

<template>
    <lightning-card title="Wire Function" icon-name="standard:contact">
        <template if:true={record}>
            <div class="slds-m-around_medium">
                <p>{name}</p>
            </div>
        </template>
        <template if:true={error}>
            <c-error-panel errors={error}></c-error-panel>
        </template>
    </lightning-card>
</template>

reference:

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