Please let me know how to display it on my aura component as below is m code.

component
-----------------------------




<aura:component controller='AccountContact'>
    <aura:attribute name='accConList' type='Object[]'/>
    
    <aura:handler name='init' value='{!this}' action='{!c.doInit}'/>
   -------- {!v.accConList[0].accRec[0].Name}
    <aura:iteration items='{!v.accConList}' var='accCon'>
        lets see !!!!
         {!accCon.accRec[0].name}&nbsp;
        
    </aura:iteration>
</aura:component>



---------------------

controller.js
-----------------------------------------------------
({
doInit : function(component, event, helper) {
//alert('inside do init');
var action=component.get('c.fetchAccountContact');

action.setCallback(this,function(response){

var state=response.getState();
if(state=='SUCCESS' || state=='DRAFT'){
var returnValue=response.getReturnValue();
console.log('data returned---'+returnValue);
console.log('data returned---'+JSON.stringify(returnValue));
alert('reurt value---'+JSON.stringify(returnValue));
component.set('v.accConList',response.getReturnValue());


}

});
$A.enqueueAction(action);
}
})
--------------------------------
apex controller
-----------------------------------------
public class AccountContact{
public static list accList=new list();
public static List accConList{get; set;}

@AuraEnabled
public static List fetchAccountContact()
{
accList=[Select Id,Name,Phone,(select id,lastname from contacts) from Account];
for(integer i=0;i();
accConList.add(new AccConWrap(accList[i],accList[i].Contacts));
}

return accConList;
}

public class AccConWrap{

public Account accRec{get;set;}
public List conRecList{get;set;}

public AccConWrap(Account acc,List con){
accRec=acc;
conRecList=con;
}
}
}
------------------------------------------------