Hello,
I have a field on User with the name Vertreter__c which is a Hierarchy field. I want to display the Vertreter__c details in my component but I only get blank space. Could you tell me how I can make it work?

my code:
 

<aura:component controller="VisitenkarteRecordDetails" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:attribute name="OwnerUser" type="user" default="{'sobjectType' : 'User'}" />   
    <aura:attribute name="ids" type="id" default="{!v.recordId}" />
    
    <div class="c-container" style=" border-radius: 4px;  background-color: #FFFFFF; ">
        <lightning:layout >            
            <lightning:layoutItem padding="around-small">
                <div class="header-column">
                    <img src="{!v.OwnerUser.SmallPhotoUrl}" class="img_size" variant="circle" height="180px;"  />
                </div>
            </lightning:layoutItem>            
            <lightning:layoutItem padding="around-small">                
                <br></br>                
                <div class="header-column" width="100%">
                    <div style="font-size: 15px;"><b>{!v.OwnerUser.Name}</b></div>
                    <div style="font-size: 10px;">Team {!v.OwnerUser.Team_2020__c}</div>
                    <div>
                        <a href="{!'tel:' + v.OwnerUser.MobilePhone}"><lightning:icon iconName="action:call" size="xx-small" alternativeText="Telefon" title="Telefon" /></a>&nbsp;
                        <a href="{!'mailto:' + v.OwnerUser.Email}"><lightning:icon iconName="action:email" size="xx-small" alternativeText="E-Mail" title="E-Mail" /></a>&nbsp;
                        <a href="{!v.OwnerUser.Link_BookingTime__c}" target="_blank"><lightning:icon iconName="action:new_event" size="xx-small" alternativeText="BookingTime" title="BookingTime" /></a> 
                    </div>
                    
                </div>
            </lightning:layoutItem>
            <lightning:layoutItem padding="around-small">                
                <br></br>                
                <div class="header-column" width="100%" rendered="{v.OwnerUser.Urlaub__c == 'false'}">
                    <div style="font-size: 15px;"><b>{!v.OwnerUser.Vertreter__c.Name}</b></div>
                    <div style="font-size: 10px;">Team {!v.OwnerUser.Team_2020__c}</div>
                    <div>
                        <a href="{!'tel:' + v.OwnerUser.Vertreter__c.MobilePhone}"><lightning:icon iconName="action:call" size="xx-small" alternativeText="Telefon" title="Telefon"   /></a>&nbsp;
                        <a href="{!'mailto:' + v.OwnerUser.Vertretung__c.Email}"><lightning:icon iconName="action:email" size="xx-small" alternativeText="E-Mail" title="E-Mail" /></a>&nbsp;
                        <a href="{!v.OwnerUser.Link_BookingTime__c}" target="_blank"><lightning:icon iconName="action:new_event" size="xx-small" alternativeText="BookingTime" title="BookingTime" /></a> 
                    </div>
                    
                </div>
            </lightning:layoutItem>
             
        </lightning:layout>        
    </div>    
</aura:component>