2

In a lightning component, I am trying to use the values in 1 array to set the values for a field in a second array. But for whatever reason I always end up with the last value of my array as the field value.

Here is the component:

<aura:attribute name="spaceTypeList" type="string[]" default="Conference/Focus Room,Copy Area,Kitchenette,Loading Dock,Electrical Room,Exterior Building,Janitorial Closet,Mothers Room,Office Area,Parking Garage,Restrooms/Locker Rooms,Stairs/Elevators,Carpet Spots/Vacuuming/Flooring,Lobbies/Corridors"/>
<aura:attribute name="detailRecord" type="Inspection_Area_Detail__c" 
                    default="{'Inspection_Area__c':'',
                             'Space_Subset__c':'',
                             'Rating__c':'0',
                             }"/>
<aura:attribute name="detailList" type="Inspection_Area_Detail__c[]"/>

<ui:button label="loop test" press="{!c.loop}"/>

<aura:iteration items="{!v.detailList}" var="det">
    <p> Space {!det.Space_Subset__c}</p>
</aura:iteration>

And here is the controller:

({
    loop: function(component, event, helper) {

        var spaceList = component.get("v.spaceTypeList");
        var detail = component.get("v.detailRecord");
        var List =component.get("v.detailList");
        var List2 =component.get("v.testList");
        for(i in spaceList){
            var space =spaceList[i];
            detail.Space_Subset__c = space;
            console.log("detail space subset "+detail.Space_Subset__c);
            List.push(detail);
            List2.push(detail.Space_Subset__c);
        }
        component.set("v.detailList",List);
        component.set("v.testList",List2);
    },
})

Thank you for your help.

2
  • where have you declared testList ? Commented Feb 12, 2016 at 2:46
  • Sorry testList was not supposed to make it to stackexchange. It is currently just an array , just wanted to see if I could populate a second array from the loop in the controller. Commented Feb 12, 2016 at 2:48

2 Answers 2

3

Analysed the root cause of this issue .Since lightning is two way binded with UI ,the new values are always equal to the present instance of attribute.

Lets try and understand with more console log statements

With your original code

<aura:component >
<aura:attribute name="spaceTypeList" type="string[]" default="Conference/Focus Room,Copy Area,Kitchenette,Loading Dock,Electrical Room,Exterior Building,Janitorial Closet,Mothers Room,Office Area,Parking Garage,Restrooms/Locker Rooms,Stairs/Elevators,Carpet Spots/Vacuuming/Flooring,Lobbies/Corridors"/>
<aura:attribute name="detailRecord" type="Account" 
             default="{ 'sobjectType': 'Account','Name': ''}"/>
<aura:attribute name="acclst" type="Account[]"/>

<ui:button label="loop test" press="{!c.loop}"/>

<aura:iteration items="{!v.acclst}" var="acc">
   <p> Space {!acc.Name}</p>
 </aura:iteration>
</aura:component>

JS client side

({
loop : function(component, event, helper) {
    var spaceList = component.get("v.spaceTypeList");
    var detail = component.get("v.detailRecord");
    var newlst =[];
    for(i in spaceList){
        console.log(i);
        var space = spaceList[i];
        var detailtemp = {};
        detailtemp = detail;
        detailtemp.Name = space;
        console.log("detail space subset "+detailtemp.Name);
        newlst.push(detailtemp);
        console.log("value after iteration"+i+JSON.stringify(newlst));
    }
    component.set("v.acclst",newlst);
},
})

The results are as below

enter image description here

enter image description here

The primary culprit is this line below

detailtemp = detail;

In short it picks latest value of attribute everytime.

Now we understand this more ,lets not use the value from the attribute instead decouple the variable

JS code

 ({
   loop : function(component, event, helper) {
    var spaceList = component.get("v.spaceTypeList");
    //var detail = component.get("v.detailRecord");lets not use this guy..He is doing mischief
    var newlst =[];
    for(i in spaceList){
        console.log(i);
        var space = spaceList[i];
        var detailtemp = {};
        detailtemp = { 'sobjectType': 'Account','Name': ''};
        detailtemp.Name = space;
        console.log("detail space subset "+detailtemp.Name);
        newlst.push(detailtemp);
        console.log("value after iteration"+i+JSON.stringify(newlst));
    }
    component.set("v.acclst",newlst);
   },
 })

The results now as expected

enter image description here

5
  • Thanks Mohith, but sadly the issue persist. Your logic is sound, I just don't understand why it does not work. Commented Feb 12, 2016 at 3:34
  • Can you explicitly say new variable ..I am off computer but this sounds interesting .. Commented Feb 12, 2016 at 3:36
  • @MaxPaq Just updated the answer with proper results . Commented Feb 12, 2016 at 5:47
  • 1
    Amazing Mohit, just tested your solution and it works! Commented Feb 12, 2016 at 15:32
  • what is i in the for(i in spaceList){ Commented Dec 30, 2018 at 20:13
0

I have created the idea for the same .Please vote it so it would be implemented by Salesforce https://success.salesforce.com/ideaView?id=0873A000000EA7VQAW

0

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.