Displaying the data in Salesforce Lightning

Apex class
----------
public class AccountsController {
  @AuraEnabled
  public static List<Account> getAccounts() {
    return [SELECT Id, name, industry, Type, NumberOfEmployees, TickerSymbol, Phone
    FROM Account ORDER BY createdDate ASC];
  }
}


AccountData.cmp
----------------------
<aura:component controller="AccountsController">
  <aura:attribute name="accounts" type="List" />
  <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
   <table class="slds-table slds-table--bordered slds-table--striped slds-table--cell-buffer slds-table--fixed-layout">
    <thead>
      <tr class="slds-text-heading--label">
        <th scope="col"><div class="slds-truncate" title="ID">ID</div></th>
        <th scope="col"><div class="slds-truncate" title="Name">Name</div></th>
        <th scope="col"><div class="slds-truncate" title="Type">Type</div></th>
        <th scope="col"><div class="slds-truncate" title="Number Of Employees">Number Of Employees</div></th>
        <th scope="col"><div class="slds-truncate" title="Ticker Symbol">Ticker Symbol</div></th>
        <th scope="col"><div class="slds-truncate" title="Phone">Phone</div></th>
      </tr>
    </thead>
    <tbody>
      <aura:iteration items="{!v.accounts}" var="account">
        <tr>
          <th scope="row"><div class="slds-truncate" title="{!account.Id}">{!account.Id}</div></th>
          <td><div class="slds-truncate" title="{!account.Name}">{!account.Name}</div></td>
          <td><div class="slds-truncate" title="{!account.Type}">{!account.Type}</div></td>
          <td><div class="slds-truncate" title="{!account.NumberOfEmployees}">{!account.NumberOfEmployees}</div></td>
          <td><div class="slds-truncate" title="{!account.TickerSymbol}">{!account.TickerSymbol}</div></td>
          <td><div class="slds-truncate" title="{!account.Phone}">{!account.Phone}</div></td>
       
        </tr>
      </aura:iteration>
    </tbody>
  </table>
</aura:component>

controller
-----------

({
  doInit: function(component, event, helper) {   
    // Fetch the account list from the Apex controller 
    helper.getAccountList(component);
  }

})

Helper class
-------------

({
  // Fetch the accounts from the Apex controller
  getAccountList: function(component) {
    var action = component.get('c.getAccounts');
    // Set up the callback
    var self = this;
    action.setCallback(this, function(actionResult) {
     component.set('v.accounts', actionResult.getReturnValue());
    });
    $A.enqueueAction(action);
  }
})




























Comments