Ionic 2 - how to prevent page changes on ion-slides by swipe gesture?
The way i do this is:
On my .ts file of the page i have a slide i do this
import { Component, ViewChild } from '@angular/core';
import { Slides } from 'ionic-angular';
@Component({
selector: 'page',
templateUrl: 'page.html'
})
export class Page{
@ViewChild(Slides) slides: Slides;
contructor() {
this.slides.lockSwipes(true);
}
nextSlide(){
this.slides.lockSwipes(false);
this.slides.slideNext();
this.slides.lockSwipes(true);
}
}
And in your HTML you call the function on a button
<button ion-button block (tap)="nextSlide()">NEXT</button>
So when the page is beeing constructed i lock the swipe, and when someone click next/back i unlock the swipe, go to next slide and lock it back.
Hope it helps
Since externalOnly isn't working in Ionic 4 anymore, i looked into the Swiper API documentation and saw that it changed to allowTouchMove
now.
So: <ion-slides [options]="{allowTouchMove:false}"