ion slides next by button

Solutions on MaxInterview for ion slides next by button by the best coders in the world

showing results for - "ion slides next by button"
Nicolás
28 Apr 2018
1import { ViewChild } from '@angular/core';
2import { IonSlides } from '@ionic/angular';
3...
4@ViewChild('slides') slides: IonSlides;
5next() {
6	this.slides.slideNext();
7}
8
9prev() {
10	this.slides.slidePrev();
11}
12...
13// in html
14<ion-slides #slides>
15   <ion-slide>
16   </ion-slide>
17
18   <ion-slide>
19   </ion-slide>
20
21  <button type="submit" float-left ion-button  color="primary" class="btnPrev" (click)="prev()">Prev</button>
22  <button type="submit" float-right ion-button color="primary" class="btnNext" (click)="next()">Next</button>
23     
24</ion-slides>
Luigi
21 May 2019
1import { IonSlides} from '@ionic/angular';
2
3
4 export class HomePage {
5
6      @ViewChild('mySlider')  slides: IonSlides;
7
8      swipeNext(){
9        this.slides.slideNext();
10      }
11
12    }
13    
14    
15    <html>
16     <ion-slides pager="true"  pager="false" #mySlider>
17
18   <ion-slide>
19   </ion-slide>
20
21   <ion-slide>
22   </ion-slide>
23
24    <ion-button (click)="swipeNext()">Next</ion-button>
25
26 </ion-slides>
27 <html>