Unable to access custom type array properties in lightning component

Question

I have an attribute in a lightning component that is a custom type array

<aura:attribute name="objClassController" type="MyController.MyParser[]" />

I've debugged to verify that I'm getting results returned from the callback. I can see that the callback function is successful and the response contains the object array.

I'm using aura:iteration in the component:

    <tbody>
        <aura:iteration items="{!v.objClassController.results}" var="obj">
        <tr>
            <td>{!obj.rewardId}</td>
        </tr>
        </aura:iteration>
    </tbody>

Here is the main class:

public class MyController {

@AuraEnabled public List<MyParser> results {get; set;}

@AuraEnabled
public static List<MyParser> getRewardsInfo(string caseId) {
    List<MyParser> retval = new  List<MyParser>();
    String uid = [select Order__r.Order_Number__c from Case where Id =: caseId].Order__r.Order_Number__c;
    HttpRequest req = new HttpRequest();
    req.setMethod('GET');
    req.setEndpoint('callout:Rewards/user/'+uid+'/rewards/all');
    Http http = new Http();
    HTTPResponse res = http.send(req);
    retval = MyController.parse(res.getBody()); 
    return retval;
}

public static List<MyParser> parse(String json) {
    return (List<MyParser>) System.JSON.deserialize(json, List<MyParser>.class);
}
}

Here is the parser class:

public class MyParser {

    @AuraEnabled public String rewardId;
    @AuraEnabled public String rewardProgramCode;
    @AuraEnabled public String currentPoint;
    @AuraEnabled public Coupon coupon;
    @AuraEnabled public String lastActivityDate;


    public class Coupon {
        public String couponCode;
        public String status;
    }
}

I am not able to access the data that is returned in the List<MyParser> results property when using aura:iteration. Are the properties that are within the MyParser class not accessible? I've annotated the properties with @auraEnabled and they are public. Nothing displays when I view the component in a lightning record page, but I know the data is returned because the debug and console log statements shows data getting correctly returned. Is the dot notation I'm using to access the data incorrect?

Answer 1

You can't access controller variables this way, as you would in Visualforce. Instead, you need to call the method and set the attribute appropriately.

<aura:attribute name="results" type="MyController.MyParser[]" />

---

    <aura:iteration items="{!v.results}" var="obj">

---

let action = component.get("c.getRewardsInfo");
action.setParams({caseId: component.get("v.recordId") });
action.setCallback(this, function(result) {
  if(result.getState() === "SUCCESS") {
    component.set("v.results", result.getReturnValue());
  } // handle ERROR, too.
}); 
$A.enqueueAction(action);

P.S. The inner class attributes also need to be annotated:

public class Coupon {
    @AuraEnabled public String couponCode;
    @AuraEnabled public String status;
}

You can remove:

@AuraEnabled public List<MyParser> results {get; set;}

As there is no way to access the variable.