angular - ionic 3图像 slider 在手动滑动后停止自动播放

标签 angular typescript ionic2 ionic3

Ionic 3 图像 slider 自动播放效果很好,但当我手动滑动图像时,自动播放停止工作。下面是我的 ionic 3 代码。我真的被困在这里..

    slideData = [{ image: "../../assets/img1.jpg" },{ image: "../../assets/img2.jpg" },{ image: "../../assets/img3.jpg" }]

html代码如下

  <ion-slides  class="slide-css" autoplay="100" loop="true" speed="100" pager="true" autoplayDisableOnInteraction = "false">
  <ion-slide *ngFor="let slide of slideData">
  <img src="{{slide.image}}" />
  </ion-slide>
  </ion-slides>

最佳答案

更新:

你需要像这样使用它:

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

@ViewChild(Slides) slides: Slides;

constructor(private navCtrl: NavController, private navParams: NavParams) {
  }

  ionViewDidEnter() {
    this.slides.autoplayDisableOnInteraction = false;
  }

注意:您需要删除 html 页面上的 autoplayDisableOnInteraction = "false"

旧答案:

您可以使用 autoplayDisableOnInteraction = "false",如下所示。

    <ion-slides  class="slide-css" autoplay="100" loop="true" speed="100" 
                 pager="true" autoplayDisableOnInteraction = "false">

    </ion-slides>

See how it implements on Ionic

Swiper API

disableOnInteraction boolean true Set to false and autoplay will not be disabled after user interactions (swipes), it will be restarted every time after interaction

关于angular - ionic 3图像 slider 在手动滑动后停止自动播放,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47680612/

相关文章:

javascript - 使用 typescript 仅将 JSON 数据而不是标题提取到字符串数组

sqlite - ionic 2 错误 'ReferenceError: sqlitePlugin is not defined'

Angular 编译器找不到 jasmine.CustomMatchers,即使它在 @types/jasmine 中

javascript - Angular 2点击事件不起作用

angular - 如何在 Angular 中动态添加额外的路由

angular - 无法为 ngx-bootstrap datepicker 动态设置属性

css - 使用模态和样式的 Ionic 2 登录弹出窗口

properties - Ionic 2 - 属性绑定(bind)使应用程序不可见

javascript - 如何在 Angular Material 表中获取 <tr> 之间的间隙

angular - IdentityServer4:缺少 auth_time