1

I'm 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>

I'm getting the following error:

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"> ][slidesPerView]="3">

<img [src]="product"): MainPage@12:43 ; Zone: ; Task: Promise.then ; Value: ....

can anyone help please.

ionic -v 2.2.1

cordova -v 6.5.0

carlhandy
  • 315
  • 1
  • 8
  • 22
HMansour
  • 71
  • 3
  • 7

1 Answers1

5

Recently there was some changes in ion-slides. Make sure you have the latest ionic version (2.0.0). Also you can use slidesPerView without enclosing it in square brackets as follows

<ion-slides pager loop slidesPerView="3">
  <ion-slide>
     ...
  </ion-slide>
<ion-slides>
AishApp
  • 4,142
  • 2
  • 29
  • 33
  • it's not working

    Slide 1

    Slide 2

    Slide 3

    Slide 4

    Slide 5

    Slide 6

    Slide 7

         still shows one slide at a time     – HMansour Feb 01 '17 at 12:17