0

I am not able to use nested aura:iteration in my lightning component. Please see my lightning component code below. But, I am able to use the nested array directly by using indexing which you can see in 6th line code.

<aura:component controller="TestUtilPoc" implements="force:appHostable" access="global">
<aura:attribute name="CoursesDetailsWithOfferings" type="sObject[]" access="global" default=""/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}" access="global"/>

<aura:iteration items="{!v.CoursesDetailsWithOfferings}" var="courseDetail">                 
    <li id="{!courseDetail.courseName}">{!courseDetail.courseName}  </li>
    <span>{!courseDetail.courseOfferings[0].Campus_Location__c}</span>
    <aura:iteration items="{!courseDetail.courseOfferings}" var="courseOffering">
        <span id="{!courseOffering.Campus_Location__c}">{!courseOffering.Campus_Location__c}</span>
    </aura:iteration>
</aura:iteration>

Please check my JSON data which I am getting in the helper.

CoursesDetailsWithOfferings - It contains the following array.

[{courseName: "BCA", 
              courseOfferings:[
                   {Campus_Location__c:"Delhi",
                    Name: "Test1",
                    Start_Date__c: "2017-10-03", 
                    End_Date__c: "2019-10-02"}]},
 {courseName: "MCA", 
              courseOfferings:[
                   {Campus_Location__c:"Goa",
                    Name: "Test2", 
                    Start_Date__c: "2017-11-03", 
                    End_Date__c: "2019-11-02"}]
 }]

Please help me to fix it. Thanks in advance!!!!!

2
  • How did you define the aura attributes? Oct 5, 2017 at 14:28
  • I have added component code with attributes Oct 6, 2017 at 9:11

1 Answer 1

0

Please check the following sample code . You need to define your attribute properly.

App

<aura:application >
 <c:ClassOffering/>
</aura:application>

Component

<aura:component controller="LightningTest" implements="force:appHostable" access="global" >

<aura:attribute type="Course[]" name="CoursesDetailsWithOfferings"/>
<aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
<aura:iteration items="{!v.CoursesDetailsWithOfferings}" var="courseDetail">                 
        <li id="{!courseDetail.courseName}">{!courseDetail.courseName}</li>

    <span>{!courseDetail.courseOfferings[0].campus_location}</span> <br/>
       <aura:iteration items="{!courseDetail.courseOfferings}" 
var="courseOffering">
            <span id="{!courseOffering.campus_location}">
{!courseOffering.campus_location}</span>
       </aura:iteration>
</aura:iteration>

</aura:component>

Controller

({
doInit : function(component, event, helper) {
    var action=component.get("c.getCourses");
    console.log('inside do init');
    action.setCallback(this,function(resp){
       console.log(resp.getReturnValue()) ;
       component.set("v.CoursesDetailsWithOfferings",resp.getReturnValue());
    });
    $A.enqueueAction(action);
}
})

Lightning Server-Side Controller

public class LightningTest{


@auraEnabled
public static List<Course> getCourses(){

    list<Course> courses=new List<Course>();
    for(integer i=0;i<=1;i++){
        course c=new course();
        c.courseName= 'course '+ string.valueOf(i);

        for(integer j=0;j<=1;j++){
            courseOffering offering=new courseOffering();
            offering.campus_location ='location ' + string.valueOf(j);
            offering.Name='offering name ' + string.valueOf(j);
            c.addOffering(offering);

        }
        courses.add(c);
    }

    return courses;

}


}

Data Classes

public class Course{
    @auraEnabled
    public string courseName;
    @auraEnabled
    public List<courseOffering> courseOfferings;
    public course(){
        courseOfferings=new List<courseOffering>();
    }
    public void addOffering(courseOffering offer){
        courseOfferings.add(offer);
    }

}

public class courseOffering{
    @auraEnabled
    public string campus_location;
    @auraEnabled
    public string name;

}

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .