1

Hello I am creating a lightning component. I have a list of accounts obtained by a query in an apex class. I want to send this list to an array in a javascript controller that will let me assign the record values to variables

Apex:

public with sharing class AccountController 
{
    @AuraEnabled
    public static List<Account> getAccounts() 
    {
        List<Account> Accounts =  [SELECT Id, Name FROM Account];
        return Accounts;
    }
}

JavaScript controller:

doInit: function(component, event, helper) 
{
    ///Obtain account record list from Apex SOQL and pass it to an array.
    //var records = [] ???
    //This list is what will be passed to lightning component when function ends.
    var newItems=[];

    //Loop through records array and create item list using record field values.
    for (var i=0; i< records.length; i++)
    {
        var record = records[i];
        var Item = {title: record.name, id: record.id, status: "Unassigned"};
        newItems.push(Item);
    }  
    //Pass items into component
    component.set("v.allItems", newItems);
},

2 Answers 2

1

You can do as follows:-

var action = component.get("c.getAccounts");
action.setCallback(this, function(response){
    var state = response.getState();
    if(state === 'SUCCESS'){
        var res = response.getReturnValue();
        for(var i = 0; i < res.length; i++){
            //set the values here
        }
    }
}

What I am doing here is:- Calling the apex method and storing the response value in a variable. I have run a for loop to iterate through the list. If you have an attribute of type List in Component then you can directly set the values to that attribute.

Like this:- component.set("v.lstRecord",response.getReturnValue());

0

You start it from your component by declaring an array which will host your returned data from Apex. So you need to have a variable as something below on your component.

<aura:attribute name="myAccountList" type="Account[] />

Now in your JS, when you have fetched the List<Account> from Apex, you just use to set that value on the attribute you declared on the component.

var action = cmp.get("c.getAccounts");
action.setCallback(this, function(response) {
        var state = response.getState();
        if (state === "SUCCESS") {
            var myAccountsFromServer = response.getReturnValue();
            // here's where you set the list of accounts that you received 
            // from server and setting that in component
            component.set("v.myAccountList", myAccountsFromServer);
            ....
         }
}

So when your JS function ends, you have the list of records back from server on the component.

Now in your component, to display the values that you receive, you just iterate over the attribute, something as below:

  <aura:iteration items="myAccountList" var="acct">
      {!acct.Id} -- this gives you the Id of the record
      {!acct.Name} -- this gives you the Name of the record
  </aura:iteration>
</aura:component>
3
  • What is your confusion? If I read your question right, you want to get the list of accounts returned from apex on your component, right? If that's the case, then what I have mentioned is the way to do so. You should start on the documentation if you need more details.
    – Jayant Das
    Sep 21, 2018 at 13:53
  • I want to pass in my newItems array with values taken from the records. Title is the record name, and id is the record id. In my component a column is used that displays all these items. Currently it looks like this hardcoded. //Hardcoded items var newItems = [{title: "Apple", id: "1", status: "Unassigned"}, {title: "Berry", id: "2", status: "Basket 1"}, {title: "Carrot", id: "3", status: "Basket 2"},]; //Pass items in component.set("v.allItems", newItems); Sorry if i'm being thick, i'm brand new to lightning components. Sep 21, 2018 at 13:58
  • You don't need to populate anything extra in JS, if your use case is to just display on your component as received from the apex. I have added an example as how you can iterate over the values in your component.
    – Jayant Das
    Sep 21, 2018 at 14:15

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.