My requirement is to display all the saved values on load for a Custom object called Company__c. Fields being Full_Name__c (text), Address__c(text area) , Director_Name__c (text), Phone__c (phone) and  Additional_Information__c(text). 

At present iteration is happening correctly and I can view inserted records via console.log in helper and system.debug in backend. However all the records getting displayed are empty with just one display button.

My Component code is as :- CompanyInfo.cmp

          <aura:component     implements="force:hasRecordId,           force:appHostable , flexipage:availableForRecordHome" 
                controller="CompanyController">
   <aura:registerevent name="forceNavig2Component"     type="force:navigateToComponent"/> 
    <aura:attribute name="Companies" type="Company__c"/>
    
        <!-- Handle component initialization in a client-side controller -->
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    
    <!-- SHOW LOADING SPINNER--> 
    <lightning:spinner variant="brand" size="large"       aura:id="Id_spinner"   class="slds-hide" />

 <!-- Attribute declaration -->
    <aura:attribute name="companyObj" type="Company__c" default="    { 'sobjectType': 'Company__c' ,
                                                                 'Name':'',
                                                                 'Full_Name__c':'',
                                                                 'Director_Name__c':'',
                                                                 'Address__c':'',
                                                                 'Phone__c':''}"/>
    
    
    <div class="slds-grid">
        <lightning:card title="New Record" footer="Click on Save button     to create new Record.">
            <!-- Save button -->
            <aura:set attribute="actions">
                <lightning:button aura:id="saveId"
                                  label="Save"   
                                  onclick="{!c.doSave}"/>
            </aura:set>
            <!--/ Save button -->
            
            <!-- Body -->
            <p class="slds-p-horizontal_small">
                <lightning:input aura:id="CompanyName"
                                 label="Company Name"
                                 type="String"
                                 required="true"
                                 value="{!v.companyObj.Name}"/>
                <lightning:input aura:id="CompanyFullName"
                                 label="Full Name"
                                 type="String"
                                 required="true"
                                 value="{!v.companyObj.Full_Name__c}"/>
                    <lightning:input aura:id="CompanyDirector"
                                 label="Director Name"
                                 type="String"
                                     required="true"
                                 value="{!v.companyObj.Director_Name__c}"/>
                    <lightning:input aura:id="CompanyAddress"
                                 label="Address"
                                     required="true"
                                 type="String"
                                 value="{!v.companyObj.Address__c}"/>
                <lightning:input aura:id="CompanyPhone"
                                 label="Phone No"
                                 type="Number"
                                 required="true"
                                 value="{!v.companyObj.Phone__c}"/>
            </p>
            <!--/ Body -->
        </lightning:card>
        
         
     </div>
    
     <aura:iteration var="Company" items="{!v.Companies}">
                <!-- If you’re using a namespace, replace with                                       myNamespace:contacts-->
                <c:Companies Company="{!Company}"/>
            </aura:iteration>
 
      
     </aura:component>

Referred Component code for Companies.cmp is :-
       <aura:component>
         <aura:attribute name="Company" type="Company__c" />
    
        <lightning:card variant="Narrow" title="{!v.Company.Name}"                     iconName="standard:contact" >
            <aura:set attribute="actions">
                <lightning:button name="details" label="Details" onclick="              {!c.goToRecord}" />
            </aura:set>    
            <aura:set attribute="footer">
                <lightning:badge label="{!v.Company.Name}"/>
            </aura:set>
            <p class="slds-p-horizontal_small">
                {!v.Company.Name}
            </p>
            <p class="slds-p-horizontal_small">
                {!v.Company.Full_Name__c}
            </p>
              <p class="slds-p-horizontal_small">
                {!v.Company.Address__c}
            </p>
            <p class="slds-p-horizontal_small">
                {!v.Company.Director_Name__c}
            </p>
        </lightning:card>

         </aura:component>


Contoller code for main component is CompanyListController.js
    ({
    doInit : function(component, event, helper) {
        // Retrieve contacts during component initialization
        // 
        console.log("inside init function for loading companies")
        helper.loadCompanies(component,event, helper);
      },
      doSave : function(component, event, helper) {
    / ** Server side controller calling logic. **/
        
        //Calling server side controller's saveCompany() method.
        var action = component.get("c.saveCompany");
        //console.log(action);
        //
        //Set method parameter of saveCompany() method.
        action.setParams({"company":                                                                      component.get("v.companyObj")});
        
        action.setCallback(this, function(response){
            console.log('inside callback');
            //<response.getState()> return response status as                              SUCCESS/ERROR/INCOMPLETE etc.
            var state = response.getState();
            console.log("response state is"+ state);
            //If response from server side is <SUCCESS>, then we will                    display a success message.
            if (state === "SUCCESS"){
                //Success message display logic.
                var toastEvent = $A.get("e.force:showToast");
                toastEvent.setParams({
                    "title": "Success!",
                    "message": "Company record has been inserted                               successfully."
                });
                toastEvent.fire();
            }else if (state === "INCOMPLETE") {
                //Offline message display logic.
                var toastEvent = $A.get("e.force:showToast");
                toastEvent.setParams({
                    "title": "OFFLINE!",
                    "message": "You are in offline."
                });
                toastEvent.fire();
            }else if (state === "ERROR") {
                //Error message display logic.
                var errors = response.getError();
                var toastEvent = $A.get("e.force:showToast");
                toastEvent.setParams({
                    "title": "ERROR!",
                    "message": errors[0].message
                });
                toastEvent.fire();
            }else {
                //Unknown message display logic.
                var toastEvent = $A.get("e.force:showToast");
                toastEvent.setParams({
                    "title": "UNKOWN!",
                    "message": "Unknown error."
                });
                toastEvent.fire();
            }
        });
        
        $A.enqueueAction(action);
        }
       })


Helper code is as follows:-

      ({
        loadCompanies : function(component,event, helper) {
         // show spinner message
         component.find("Id_spinner").set("v.class" , 'slds-show');
         // Load all contact data
         var action = component.get("c.getCompanies");
         action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                 // show spinner message
            component.find("Id_spinner").set("v.class" , 'slds-hide');
                var data = JSON.stringify(response.getReturnValue());
                console.log(data)
                component.set("v.Companies", data);
                console.log(component.get("v.Companies"));
                //var val = JSON.stringify(response.getReturnValue());
                //console.log("return value is "+val);
            }

            // Display toast message to indicate load status
            var toastEvent = $A.get("e.force:showToast");
            if (state === 'SUCCESS'){
                toastEvent.setParams({
                    "title": "Success!",
                    "message": " Your contacts have been loaded                                successfully."
                });
            }
            else {
                toastEvent.setParams({
                        "title": "Error!",
                        "message": " Something has gone wrong."
                });
            }
            toastEvent.fire();
        });
         $A.enqueueAction(action);
     }
          })



Apex class is as follows:-
      public with sharing class CompanyController {

       @AuraEnabled
      public static void saveCompany(Company__c company){
         INSERT company;
       }
    
    @AuraEnabled
    public static List<Company__c> getCompanies() {
        List<Company__c> companies = 
                [SELECT Name,       Full_Name__c, Address__c,                              Director_Name__c FROM Company__c];
     system.debug(companies);
        //Add isAccessible() check
        return companies;
    }
   }