Iterate Map in AURA Component
I am sharing code of Map Items Iteration and Display in AURA component
IterateMapController
public class IterateMapController {
@AuraEnabled
public static Map < String, String > fetchMapvalues() {
Map < String, String > prodMap = new Map < String, String >();
prodMap.put('item1', Nokia);
prodMap.put('item2', Samsung);
prodMap.put('item3', LAVA);
prodMap.put('item4', ONE PLUS);
system.debug(prodMap);
return prodMap;
}
}
.cmp
<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" access="global">
<aura:handler name="init" value ={!this} action="{!c.doinit}"/>
<aura:attribute name="product" type="List" />
<aura:iteration items="{!v.product}" var="prod" indexVar="key">
{!prod.key} – {!prod.value}<br/><br/>
</aura:iteration>
</aura:component>
.js
({
doinit : function(component, event, helper) {
var action = component.get("c.getMap");
action.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
var custs = [];
var conts = response.getReturnValue();
for ( var key in conts ) {
custs.push({value:conts[key], key:key});
}
component.set("v.product", custs);
}
});
$A.enqueueAction(action);
}
})
.cls
public class IterateMapController {
@AuraEnabled
public static Map < String, String > fetchMapvalues() {
Map < String, String > prodMap = new Map < String, String >();
prodMap.put('item1', Nokia);
prodMap.put('item2', Samsung);
prodMap.put('item3', LAVA);
prodMap.put('item4', ONE PLUS);
system.debug(prodMap);
return prodMap;
}
}