I’m migrating source code from ionic3 to ionic4.
The following slide page is not displayed in ionic4.
How do I fix it?
I hope you would tell me.
app.component.ts (The calling page)
...
async error => {
const walkthroughModal = await this.modalCtrl.create({component: WalkthroughPage, componentProps:{prev_page: 'login'} });
await walkthroughModal.present();
}
...
walkthrough.page.ts
@Component({
selector: 'page-walkthrough',
templateUrl: 'walkthrough.page.html',
styleUrls: ['walkthrough.page.scss'],
providers: [CustomNativeStorage]
})
export class WalkthroughPage {
...
@ViewChild('slides', {static: false}) slides: IonSlides;
...
walkthrough.page.html
<ion-slides pager="true">
<ion-slide *ngFor="let slide of walkthroughSlides" [style.background-image]="slide.img">
<div class="walkthrough-content-card">
<div class="text-container">
<div class="walkthrough-title">
{{ slide.title }}
</div>
<div class="walkthough-text">
{{ slide.text }}
</div>
</div>
<div class="button-container">
<ion-button class="button_continue" color="bright" (click)="slideNext()">
CONTINUE
</ion-button>
</div>
</div>
</ion-slide>
</ion-slides>