离子2 - 如何通过滑动手势防止离子载玻片上的页面变化？

Question

我看到了许多不同来源的解决方案，包括Stack Overflow。这部分对我有用：我无法左右滑动切换页面。没关系 ！但是，如果用户点击一个按钮，按住并按下按钮，这将导致分页。 （我只是测试使用的是Android）

有许多来源，根据该解决方案是一个：

<ion-slides [options]="{onlyExternal: false}"> 
</ion-slides> 

让我说明这一点与截图...

如果我这里刷，什么都不会发生

现在，如果我拿着并刷红色按钮，这将导致分页。

Answer 1

我做到这一点的方法是：

在我的.ts的页面我有一个幻灯片文件，我这样做

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); 
    } 
} 

而在你的HTML调用该函数在一个按钮上

<button ion-button block (tap)="nextSlide()">NEXT</button> 

所以当页面构造时我锁定滑动，当有人点击下一步/返回时，我解锁滑动，转到下一张幻灯片并将其锁定。

希望它有帮助