I have a scenario where I am building a Javascript Map() object in my client controller helper of a Lightning component. Ideally, I would like to use this map for client-side filtering in a component. Each key value pair would contain the filter value as the key and the record to be returned as the value.
I am initially building this map object in the callback of the init function when I have successfully retrieve Account records from the server. This code is below:
({
// Fetch the accounts from the Apex controller
getAccountList: function(component) {
var action = component.get('c.getAccounts');
// Set up the callback
var self = this;
action.setCallback(this, function(actionResult) {
component.set('v.accounts', actionResult.getReturnValue());
this.buildJSONLookup(component);
});
$A.enqueueAction(action);
},
buildJSONLookup: function(component) {
var recordList = component.get('v.accounts');
var mAccounts = new Map();
recordList.forEach(function(account) {
if(mAccounts.has(account.CreatedDate)) {
mAccounts.get(account.CreatedDate).push(account);
} else {
mAccounts.set(account.CreatedDate, [account]);
}
});
component.set('v.mAccounts', mAccounts);
console.log(component.get('v.mAccounts'));
}
})
At the end, I am trying to set the new Javascript Map() object to the attribute "Map" type in the component markup. However, when I try to log that component attribute to the console after the value has been set, it simply returns an empty object.
I am wondering if it is possible to set this ECMAScript 6 Javascript map to a Lightning component attribute with the "Map" type? If not, I wanted to see if there were any work arounds? I preferably want to use some kind of lookup function that would prevent looping through the entire list of records each time filtering happens.