How to Get Custom Metadata Type data Lightning Web Components(lwc) without Apex

Hello All,

Today we will talk about Custom Metadata type and how to get Cusotm Metadata Type details into to LWC without writing any apex code.

Detail about Custom Metadata type:-

1) Custom metadata are like custom settings but records in custom metadata type 
    considered as metadata rather than data.
2) Custom MetaData are mostly used to define application configurations that need to be  migrated from one environment to another, or packaged and installed.
3)we can not perform CUD Create, Update, Delete) operation on custom metadata 
   type in apex.

AS we know in Custom Object suffix is __C  but for Custom Metadata type we are using __mdt

How to Get Custom Metadata Type data Lightning Web Components(lwc) without Apex

To Achive this we can use Wire service to get record data, the Lightning Web Component uses the getRecord wire adapter.

Syntax

import { getRecord } from 'lightning/uiRecordApi';

Sample Code:-
1) create Custom Metadata type:-
2) Get into LWC

 create Custom Metadata type:

Get into LWC

myMetadata.html

    <lightning-card title="Custom Metadata Types Record Values" icon-name="standard:contact">

        <template if:true={objMetadataValues}>

            <dl class="slds-list_horizontal slds-wrap" style="margin-left: 3%;">

                <dt class="slds-item_label slds-truncate" title="First Name">Master Label</dt>

                <dd class="slds-item_detail slds-truncate"><b>{objMetadataValues.MasterLabel}</b>                    </dd>

                <dt class="slds-item_label slds-truncate" title="Last Name">Developer Name:</dt>

                <dd class="slds-item_detail slds-truncate"><b>{objMetadataValues.DeveloperName}                </b></dd>

                <dt class="slds-item_label slds-truncate" title="Full Name">Active:</dt>

                <dd class="slds-item_detail slds-truncate"><b>{objMetadataValues.Active}</b>                        </dd>

            </dl>

        </template>

    </lightning-card>

</template>

myMetadata.js

import { LightningElement, wire } from 'lwc';

import { getRecord } from 'lightning/uiRecordApi';

const FIELDS = [

    'MY_Account_Data__mdt.MasterLabel',

    'MY_Account_Data__mdt.DeveloperName',

    'MY_Account_Data__mdt.isActive__c',

    'MY_Account_Data__mdt.AccoutType__c',

];

export default class myMetadata extends LightningElement {   

  @track objMetadataValues = {};

    

    // using wire service getting current user data

    // HardCoded the Record Id you can dynamically pass the record id using track or api decorates

    @wire(getRecord, { recordId: 'm02B00000006hGx', fields: FIELDS })

    userData({error, data}) {

        if(data) {

            let currentData = data.fields;

            this.objMetadataValues = {

                MasterLabel : currentData.MasterLabel.value,

                DeveloperName: currentData.DeveloperName.value,

                Active: MY_Account_Data__mdt.AccoutType__c,

                   AccountType:MY_Account_Data__mdt.AccoutType__c

         

            }

        } 

        else if(error) {

            window.console.log('error ====> '+JSON.stringify(error))

        } 

    }

}

Output