Ion-slides slidesPerView

Ionic Framework ionic-v3
1

am using ion-slides as the following:

<div *ngFor="let category of categories">
		<h6 class="slide-title" [innerHTML]="category.name"></h6>
		<ion-slides [loop]="true" [pager]="true" [slidesPerView]="3">
			<ion-slide *ngFor="let product of category.products">
				<img [src]="product.image" class="slide-image">
			</ion-slide>
		</ion-slides>
	</div>

Unhandled Promise rejection: Template parse errors:
Can’t bind to ‘slidesPerView’ since it isn’t a known property of ‘ion-slides’.

  1. If ‘ion-slides’ is an Angular component and it has ‘slidesPerView’ input, then verify that it is part of this module.
  2. If ‘ion-slides’ is a Web Component then add “CUSTOM_ELEMENTS_SCHEMA” to the ‘@NgModule.schemas’ of this component to suppress this message.
    ("h6 class=“slide-title” [innerHTML]=“category.name”>
    <ion-slides [loop]=“true” [pager]=“true” [ERROR ->][slidesPerView]=“3”>
    <ion-slide *ngFor=“let product of category.products”>
    <img [src]=“product”): MainPage@12:43 ; Zone: ; Task: Promise.then ; Value: …

can anyone help please.

2

I have the same error, since i update to version 3 and angular 4

3

Although you can’t set the property in the html template, you can set it in your controller. Try something like this:

ngOnInit() {
    this.slideComponent.centeredSlides = true;
    this.slideComponent.loop = true;
    this.storySlides.loopedSlides = 10;
  }

Where this.slideComponent refers to your ion-slides component.