As I attempt to utilize the slides and access the instance in order to use the slideto functionality programmatically, I find myself encountering the issue of receiving 'undefined' back despite following the documentation.
Here is my TypeScript code:
import { Component, ViewChild } from '@angular/core';
import { NavController, NavParams, Slides} from 'ionic-angular';
@Component({
selector: 'holiday',
templateUrl: 'holiday.html'
})
export class Holiday {
selectedItem: any;
@ViewChild('ghbslides') slider: Slides;
constructor(public navCtrl: NavController, public navParams: NavParams) {
console.log(this.slider); // returns undefined
this.selectedItem = navParams.get('holiday');
}
onSlideChanged(slide) {
console.log("slid");
}
}
Below is a snippet from the template where the slides are defined:
<ion-slides #ghbslides (ionDidChange)="onSlideChanged(index)">
<ion-slide>
<h2>Slide 1</h2>
</ion-slide>
<ion-slide>
<h2>Slide 2</h2>
</ion-slide>
<ion-slide>
<h2>Slide 3</h2>
</ion-slide>
</ion-slides>
I have attempted various solutions, but `this.slider` continues to be undefined. Any assistance would be highly appreciated as I might be overlooking something obvious.