feat(slides): add method to get previous index

Slides added method wrapper: `getPreviousIndex()`

references #5508
This commit is contained in:
Brandy Carney
2016-04-19 20:07:21 -04:00
parent 28cb089677
commit a54361cf2e
4 changed files with 21 additions and 3 deletions

View File

@ -827,6 +827,15 @@ export class Slides extends Ion {
return this.slider.activeIndex;
}
/**
* Get the index of the previous slide.
*
* @returns {number} The index number of the previous slide.
*/
getPreviousIndex(): number {
return this.slider.previousIndex;
}
/**
* Get the total number of slides.
*

View File

@ -3,6 +3,7 @@ export declare class Swiper {
constructor(container: HTMLElement, params: any);
slides: Array<HTMLElement>;
activeIndex: number;
previousIndex: number;
isEnd: boolean;
isBeginning: boolean;
update(): any;

View File

@ -9,7 +9,7 @@ class MyPage {
@ViewChild('mySlider') slider: Slides;
mySlideOptions = {
initialSlide: 1,
loop: true
loop: false
};
ngAfterViewInit() {
@ -17,8 +17,9 @@ class MyPage {
}
onSlideChanged() {
let previousIndex = this.slider.getPreviousIndex();
let currentIndex = this.slider.getActiveIndex();
console.log("Current index is", currentIndex);
console.log("Previous index is", previousIndex, "Current index is", currentIndex);
}
goToPrevSlide() {
@ -30,7 +31,7 @@ class MyPage {
}
goToSlide(index) {
this.slider.slideTo(index, 500, false);
this.slider.slideTo(index);
}
getIndex() {

View File

@ -1,16 +1,23 @@
<ion-slides #mySlider [options]="mySlideOptions" (didChange)="onSlideChanged()">
<ion-slide padding>
<h1>Slide 1</h1>
<button block (click)="goToPrevSlide()">Navigate Back</button>
<button block (click)="goToNextSlide()">Navigate Forward</button>
<button block (click)="goToSlide(2)">Navigate to 3rd Slide</button>
<button block (click)="getLength()">Get Slide Length</button>
<button block (click)="getIndex()">Get Index</button>
</ion-slide>
<ion-slide padding>
<h1>Slide 2</h1>
<button block (click)="goToPrevSlide()">Navigate Back</button>
<button block (click)="goToNextSlide()">Navigate Forward</button>
<button block (click)="goToSlide(2)">Navigate to 3rd Slide</button>
<button block (click)="getIndex()">Get Index</button>
</ion-slide>
<ion-slide padding>
<h1>Slide 3</h1>
<button block (click)="goToPrevSlide()">Navigate Back</button>
<button block (click)="goToNextSlide()">Navigate Forward</button>
<button block (click)="getIndex()">Get Index</button>
</ion-slide>
</ion-slides>