Couldn't use options property of ion-slides - ionic-framework

Question

I have created a new app using Ionic v4 and tried adding slides to my app but I get an error stating
Can't bind to 'options' since it isn't a known property of 'ion-slides'
The html is
<ion-content padding>
<ion-slides [options]="slideOpts">
<ion-slide>
<h1>Slide 1</h1>
</ion-slide>
<ion-slide>
<h1>Slide 2</h1>
</ion-slide>
<ion-slide>
<h1>Slide 3</h1>
</ion-slide>
</ion-slides>
</ion-content>
My Ts is
import { Component,ViewChild } from '#angular/core';
import { NavController } from 'ionic-angular';
#Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
slideOpts = {
initialSlide: 1,
speed: 400
};
constructor(public navCtrl: NavController) {
}
}
However the same worked for me in Ionic v3. Could anyone please help me out?

Answer 1

Try this.. its working fine ionic 4.0.0
import { IonSlides } from '#ionic/angular';
#Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
#ViewChild(IonSlides) slides: IonSlides;
slideOpts = {
initialSlide: 1,
speed: 400
};
constructor(public navCtrl: NavController) {
}
ngOnInit() { this.slideOpts = {
initialSlide: 1,
speed: 400
};
}
}

Answer 2

Just laying my point here, especially for new people like me, so i'll try to go slow.
Assuming SlideComponent is an independant component like Directory
You already have a components.module.ts to export all components created in the components folder.
Here's how components.module.ts will look like:
import { NgModule } from '#angular/core';
import { CommonModule } from '#angular/common';
import { SlidesComponent } from './slides/slides.component';
import { IonicModule } from '#ionic/angular'; //import
#NgModule({
declarations: [SlidesComponent,],
exports:[SlidesComponent, /*feel free to add any additional component*/],
imports: [
CommonModule,
IonicModule //add
]
})
export class ComponentsModule { }
PS: this works on Ionic V 6.5