Proper usage of the Content resize function

@robrechtvm wrote:

Hi,

Previously I was using duplicate code in all my pages to show a custom header with
elements.
So I refactored these header elements to a new component which is included in all pages
But after this all in my pages is behind the header parts.

I read around a bit and this should be solved with the resize property of Content.
But I don’t get it working.

Header component :

@Component({
  selector: 'userheader',
  templateUrl: 'userheader.html'
})
export class UserheaderComponent {
  text: string;
  id: string;
  customUserProfile: CustomUserProfileModel;
  public beaconMsg = 'Beacon zoeken...'
  public beaconFound = false

  constructor(  private authProvider: AuthProvider,
                private profileProvider: ProfileProvider,
                private alertCtrl: AlertController,
                private ibeacon: IBeacon,
                private platform: Platform ){
    this.id = this.authProvider.getUser().uid;
    this.profileProvider.getProfile(this.id).subscribe((profile: CustomUserProfileModel) => {
        this.customUserProfile = profile
    })
    // search for beacons
    this.platform.ready().then(() => {
      if(this.platform.is('cordova'))
        this.searchBeacon()
    })
  }

Header component html :

<ion-header>
    <div class="padding-header">
        <ion-item no-lines class="borderless">
                <ion-avatar item-start>
                        <img [src]="customUserProfile?.photoURL" alt="User Profile Picture" />
                    </ion-avatar>
        <table>
            <tr>
                <td class="headerLeft">
                    <span class="big">{{customUserProfile?.firstname}}</span><br/>
                    <span>{{customUserProfile?.lastname}}<ion-icon name="wifi" small *ngIf="beaconFound"></ion-icon>
                        <ion-icon name="alert" *ngIf="!beaconFound" small (click)="searchBeacon()"></ion-icon></span>
.......

This header component is simply imported in the pages which html on top says :

<userheader></userheader>

Where and when should I use this resize function?
Or am I screwing up now?

Thanks

Posts: 1

Participants: 1

Read full topic