Slides - Options not working

Ionic Framework ionic-v3
1

I want to create a time picker and I want to do that with two slides for hours and minutes. The slides should be next to each other and slide vertically. But it seems like the options are ignored, because it doesnt slide vertically and if I change for example the initialSlide to 6 that neither work. Here is my code:

home.html:

<div>
    <ion-card>
        <ion-row style="height:130px;">

            <ion-col width-50>
                <ion-slides #mySlider1 [options]="mySlideOptions1" pager>
                    <ion-slide *ngFor="let slider of sliderHourList">
                        <h1 class="swiperFont">{{slider.item}}</h1>
                    </ion-slide>
                </ion-slides>
            </ion-col>

            <ion-col width-50>
                <ion-slides #mySlider2 [options]="mySlideOptions1" pager>
                    <ion-slide *ngFor="let slider of sliderMinuteList">
                        <h1 class="swiperFont">{{slider.item}}</h1>
                    </ion-slide>
                </ion-slides>
            </ion-col>

        </ion-row>
    </ion-card>
</div>

home.ts:

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


@Component({
  selector: 'page-add',
  templateUrl: 'add.html'
})
export class AddPage {

    settings: any;
    sliderHourList: any;
    sliderMinuteList: any;
    sliderAMPMList: any;
    mySlideOptions1: any;

    @ViewChild('mySlider1') slider1: Slides;
    @ViewChild('mySlider2') slider2: Slides;

    constructor(public navCtrl: NavController, public navParams: NavParams, public toastCtrl: ToastController, public alertCtrl: AlertController) {

        this.settings = "normal";

        this.sliderHourList = [];
        this.sliderMinuteList = [];

        this.mySlideOptions1 = {
            initialSlide: 0,
            direction: 'vertical',
            loop: false,
            speed: 300,
            freeMode: true,
            freeModeSticky: true,
            slidesPerView: 3,
            spaceBetween: 60,
            effect: 'coverflow',
            coverflow: {
                rotate: -5,
                stretch: 0,
                depth: 50,
                modifier: 1,
                slideShadows: false
            }
        };

    }

    ionViewDidLoad() {

        for (var i = 1; i <= 24; i++) {
            
            this.sliderHourList.push({ item: this.addZero(i) });
            
        }
        for (var i = 0; i <= 60; i++) {

            this.sliderMinuteList.push({ item: this.addZero(i) });
            
        }

    }

    private addZero(num: number) {
        var result: string;
        return result = num < 10 ? '0' + num.toString() : num.toString();
    }

}

Someone know why it is not working?

2

View the RC5 Breaking Changes section in https://github.com/driftyco/ionic/blob/master/CHANGELOG.md for an explanation