"ion-slides "options" has been deprecated", now what?

Question

I'm trying to implement Ionic2's Slides, but I can't find how to set the settings:

ion-slides "options" has been deprecated. Please use ion-slide's input properties instead.

I can find the 'input properties' (e.g. autoplay, speed, direction), but I don't have a clue where to place this. Every example I find does [options]="slideOptions" where slideOptions are the settings, but that results in no result other that the deprecated notice.

I'm new to ionic v2 and typescript, I could probally get a hacky solution to work, but I want to do it right.

---

The HTML in ion-content:

<ion-slides [options]="slideOptions">
    <ion-slide *ngFor="let item of items">
        <img width="20%"src="{{item.thumb.source}}">
    </ion-slide>
</ion-slides>

And the simplified class: import { Slides } from 'ionic-angular';

@Component({
  selector: 'page-example',
  templateUrl: 'example.html'
})

export class Example {
    public items: any;
    private slideOptions: any;

    @ViewChild(Slides) slides: Slides;

    constructor(private navCtrl: NavController, public navParams: NavParams) {
        this.items = [];
        this.albumInfo = navParams.get('item');

        this.getSlides();
    }

    // This does nothing:
    goToSlide() {
        this.slides.slideTo(2, 500);
    }
    // This  does nothing:
    ngAfterViewInit() {
        this.slides.autoplay = 2000;
    }


    // Simple example of getting the slides
    makeGetRequest():Promise<string> {      
        /* Get the items code, populates this.items
    }
}

Answer 1

ion-slides have been changed. Make sure you have updated to the latest ionic version (2.0) Input properties listed in the site can be directly used in the html. Eg:

<ion-slides pager loop autoplay="2000">
 <ion-slide> ... </ion-slide>
</ion-slides>

To use properties other than those listed in input properties, you can use variable in your HTML.

<ion-slides #slides> 
   ...
</ion-slides>

and use it in TS:

 import { Component, ViewChild } from '@angular/core';
 import {Slides} from 'ionic-angular'

export class Example {
    @ViewChild(Slides) slides: Slides;
    constructor() {}
    ngAfterViewInit() {
        this.slides.autoplay = 2000;
        this.slides.autoplayDisableOnInteraction = false;
   }
}

In your case, ngAfterViewInit does nothing as you have not defined your variable in your html as <ion-slides #slides>

Answer 2

Input properties mean just the properties set in html of ion-slides and Output events are the html events. For example:

<ion-slides [autoplay]="num">
    <ion-slide *ngFor="let item of items">
        <img width="20%"src="{{item.thumb.source}}">
    </ion-slide>
</ion-slides>

where num is variable in the component with a particular number value.