How to show hidden button by *ngIf in iPhone X - ios

Question

I am creating a simple screen with ion-slides. On the last slide, i want to show a button to pop the screen.
I already accomplished this using the code below:
In my HTML
<section>
<ion-slides (ionSlideDidChange)="change()" (ionSlideReachEnd)="end()" class="slider" pager="true" paginationType="bullet" parallax="true"
centeredSlides="true" effect="slide" [options]="slideOpts">
<ng-container *ngFor="let image of imgs;">
<ion-slide>
<section>
<h1><img src={{image}}></h1>
</section>
</ion-slide>
</ng-container>
</ion-slides>
<div class="skip" *ngIf="!isSlideLast()" (click)="skip()">Skip</div>
<div class="next" *ngIf="!isSlideLast()" (click)="next()">Next</div>
<button class="start" *ngIf="isSlideLast()" (click)="skip()">Start</button>
</section>
In my .ts, I have these:
max_slide:any =3;
last: boolean = false;
callback: any;
imgs:any = [];
slideOpts = {
initialSlide: 0,
speed: 400
};
isSlideLast() {
return this.last
}
async skip() {
console.log("skip is pressed")
this.callback().then(() => {
this.navCtrl.pop();
});
}
change() {
this.slides.getActiveIndex().then(val => {
console.log(val)
if (val < this.max_slide-1) {
this.last = false;
}
})
}
end() {
console.log("end is pressed")
this.last = true;
}
next() {
console.log("next is pressed")
this.slides.slideNext();
}
There is no problem with other iPhones and android. The button shows on the last slide. But when testing with iPhone X, the button is not showing at all. The skip and next link also doesn't hide.