I want to pass Aura attribute of type map to dynamically created components. The parent and child both have Aura attribute of type map. Before creating new component, I am checking that the map attribute contains value correctly. But when checked inside of INIT of dynamically created component, it shows the map as undefined.

Please find code and corr. outputs:

Parent component:

<!--Attribute of type map in parent -->
<aura:attribute name="sampleMap" type="Map" default="{}"/>

Parent component helper:

/*Some code before this function that populates the map*/

createDynamicComponent : function(component){
    var sampleMap=component.get("v.sampleMap");
    console.log('sampleMap before CALLING: ', sampleMap);  //Outputs proper values
            "sampleMap": sampleMap
        function(newComponent, status, errorMessage){
            //Add the new button to the body array
            if (status === "SUCCESS") {
                var body = component.get("v.body");
                component.set("v.body", body);
            else if (status === "INCOMPLETE") {
                console.log("No response from server or client is offline.");
                // Show offline error
                else if (status === "ERROR") {
                    console.log("Error: " + errorMessage);
                    // Show error message

Child component:

<aura:attribute name="sampleMap" type="Map" default="{}"/>

Child component Controller:

console.log('sampleMap in child controller: ', component.get('v.sampleMap'));

Output in child controller: sampleMap: Object__proto__: Object

Its puzzling ...Probably some silly mistake , but I am not able to catch!

  • Your code is working fine for me. You should start checking with some default values in the map, instead of populating it before the call. – Santanu Halder Dec 20 '16 at 7:03
  • Do you mean adding default values to attribute while declaring? – Sarang Dec 20 '16 at 8:53
  • Yes, pass that default value to the child component. – Santanu Halder Dec 20 '16 at 9:08
  • It is just giving me the default value which I am passing from parent. However, I tried JSON.parse(JSON.stringify) and as always, it has worked and the map is passed successfully. – Sarang Dec 20 '16 at 9:33

Edited the parent helper to add this:

var sampleMap=JSON.parse(JSON.stringify(component.get("v.sampleMap")));

Now the map is passed completely. Not sure if this is the most correct/optimised/ethical/efficient way, but for now, going with it. One doubt:

Will this work with Locker service ON? I will further investigate this. Suggestions are welcome!

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.