Iterate over Object in Lightning Web Component template
Make the following changes:-
Apex: Class
public class SalesforceObject{
@AuraEnabled
public String name{set;get;}
@AuraEnabled
public String label{set;get;}
}
Lightning Web Component:-
<template iterator:obj={objectList}>
<p key={obj.value.name}>{obj.value.label}</p>
</template>
With a quick test, seems @AuraEnabled
as was case with Lightning Aura Component, the annotation is still required to access properties of custom class on a LWC as well.
So to access the properties, you will need to annotate the properties with @AuraEnabled
.
public class SalesforceObject {
@AuraEnabled public String name;
@AuraEnabled public String label;
}
And use the same case on the HTML:
<p key={object.label}>{object.name}</p>
For me Iterating over objects works perfectly fine without Annotating the properties in Apex, i am using the @wire like this:
The data received is List sent as response from the Apex. Used @track topNewsServer to assign and iterate in html
Apex method: -
@AuraEnabled(cacheable=true)
public static Map<String, Object> getTopNewsData(String filter)
{
Map<String, Object> response = new Map<String, Object>();
//performs logic here to build
List<Account> accessibleAccounts = [SELECT
Id, Name
FROM Account
ORDER BY LastModifiedDate DESC LIMIT 100];
response.put('accounts', accessibleAccounts);
// do something else...
response.put('values', timelineResponse);
return response;
}
@wire(getTopNewsData, {filter: '$topNewsKey'})
wiredTopNewsResponse({ error, data }) {
if (data) {
this.loading = false;
if(data!=null )this.topNewsServer = data.values;
} else if (error){
this.errorToastTopNews(error.body.message);
}
}