Access SOQL data in Lightning component

public class AccountContactController {
    @AuraEnabled
    public static List<Account> fetchAccount() {
        List<Account> listOfAccounts = [SELECT Name, AnnualRevenue, 

        BillingState, 

      (SELECT LastName FROM contacts) FROM Account LIMIT 10];
        return listOfAccounts;
    }
}

<aura:component controller="AccountContactController">

    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <aura:attribute name="Accounts" type="Account[]"/>
    <ul>
        <aura:iteration items="{!v.Accounts}" var="account">
       <li>AccountName: {!account.Name}</li>
        <ul>
        <aura:iteration items="{!account.Contacts}" var="contact"  

        indexVar="index">
        <li>Contact {!index + 1} : {!contact.LastName}</li>
        </aura:iteration>
            </ul>
            <hr/>
        </aura:iteration>
    </ul>
</aura:component> 

({
    doInit: function(component, event, helper) {
        var action = component.get('c.fetchAccount');
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
          component.set('v.Accounts', response.getReturnValue());
            }
        });
        $A.enqueueAction(action);
    }
})