Example:
Create a table in LWC which will display 2 columns (Object Label and Object API) table and now of rows will display based on numbers of objects available under the testing Org.
Solutions:
1. First create an Apex class named as LWCTableExamplController and under this class create a method named as getListOfObjDetails() which will return list of object details. Copy paste the below code base,
public with sharing class LWCTableExamplController {
@AuraEnabled(cacheable=true)
public static List<ObjectDetailsWrapper> getListOfObjDetails() {
Map<String, SObjectType> mapOfObjs = schema.getGlobalDescribe();
if(mapOfObjs != null && mapOfObjs.keySet() != null) {
List<ObjectDetailsWrapper> lstOfObjWrapper = new List<ObjectDetailsWrapper>();
for(String key: mapOfObjs.keySet()) {
ObjectDetailsWrapper objWrapInst = new ObjectDetailsWrapper();
if(mapOfObjs.get(key) != null && mapOfObjs.get(key).getDescribe() != null)
objWrapInst.objLabel = mapOfObjs.get(key).getDescribe().getLabel();
objWrapInst.objAPI = key;
lstOfObjWrapper.add(objWrapInst);
}
return lstOfObjWrapper;
}
return null;
}
public class ObjectDetailsWrapper {
@AuraEnabled
public String objLabel;
@AuraEnabled
public String objAPI;
}
}
2. Now Create a Lightning Web Component named as "lwcTableExample". System will automatically create 3 files (lwcTableExample.html, lwcTableExample.js, lwcTableExample.js-meta.xml) under "lwc" folder (default location).
3. Copy paste the below line of code for lwcTableExample.js-meta.xml
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
<apiVersion>49.0</apiVersion>
<isExposed>true</isExposed>
<targets>
<target>lightning__AppPage</target>
<target>lightning__RecordPage</target>
<target>lightning__HomePage</target>
</targets>
</LightningComponentBundle>
4. Copy paste the below line of code for lwcTableExample.js
import { LightningElement, wire } from 'lwc';
import getListOfObjDetails from '@salesforce/apex/LWCTableExamplController.getListOfObjDetails';
export default class LwcTableExample extends LightningElement {
@wire
(getListOfObjDetails) listOfObjectDetails;
}
5. Copy paste the below line of code for lwcTableExample.html
<template>
<table class="slds-table slds-table_bordered slds-border_left slds-border_right">
<thead>
<tr class="slds-text-title_caps">
<th scope="col">
<div title="hd1">Object Label</div>
</th>
<th scope="col">
<div title="hd2">Object API</div>
</th>
</tr>
</thead>
<tbody>
<template for:each={listOfObjectDetails.data} for:item="objIns">
<tr key={objIns.objAPI} class="slds-text-title_caps">
<td scope="col">
<div title="row1col1">{objIns.objLabel}</div>
</td>
<td scope="col">
<div title="row1col2">{objIns.objAPI}</div>
</td>
</tr>
</template>
</tbody>
</table>
</template>
6. Now create a Lightning App Builder and assign this component and from then check the output and it will look like below,
