1

I'm making a table that displays a custom object with fields retrieved from Field Set on that object (that can, of course, be changed). I have apex logic that returns the List of CustomObject__c and now I am trying to display a custom table with the data (LWC).

<table>
  <template for:each={columns} for:item='colum'>
  <thead >
    <tr class="slds-line-height_reset licenseTable-tr">
      <th key={column}>
        <div>{column}</div>
      </th>
    </tr>
  </thead>
  <tbody>
    <template for:each={customobjects} for:item='customobject'>
      <tr key={customobject.Id}>
        <template for:each={customobject} for:item='objectfield'>
          <td key={objectfield} >
            <div>{objectfield}</div>
          </td>
        </template>
      </tr>
    </template>
  </tbody>
</table>

Where columns variable holds API names of fields retrieved from fieldset. The approach above is throwing an error (Uncaught (in promise) TypeError: t[Yn] is not a function). Since I have the field API names in columns variable, initially in the inner loop I tried looping over columns and displaying {customboject[column]} but LWC does not allow expressions in HTML. Any ideas on how could I achieve such a table? Thanks

1
  • 1
    try making a structure like this: objects => [{name:objectName,fields:[Id, etc ect]},{name:objectName,fields:[Id, etc ect]}] – Caspar Harmer Dec 3 '19 at 19:56
2

At a basic level, you could just use lightning-datatable, which is build for this purpose.

Doing it yourself, you'd want to transform the object in to a list (Array), such that you'd have data like this:

[
 [ 'Value 1','Value 2','Value 3'],
 [ 'Value 1','Value 2','Value 3']
]

If possible, I recommend just using the pre-built component instead of trying to roll your own.

2
  • Thanks! Unfortunately, the table has to be heavily styled which is hard to do with lightning-datatable. As for your second suggestion, my data coming from Apex is in the format of [{CustomObject}, {CustomObject} ... ] (regular SOQL query result) should I try to transform the data in Apex or in JS? – Vathox Dec 3 '19 at 19:58
  • @Vathox I'd do it in JS, you'll get much better performance, and you can even do things like show/hide columns, etc. – sfdcfox Dec 3 '19 at 20:03

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.