Skip to main content
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");

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);

}

component.set("v.detailList",List);

},

})

Thank you for your help.
3 Antworten
  1. 21. Feb. 2016, 00:47
    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

    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

     

    ({

    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);

    },

    })

0/9000