【问题标题】:I am using autoplay property but still autoplay is not working on ion-slide in ionic 4?我正在使用自动播放属性,但自动播放仍然无法在 ionic 4 中处理离子幻灯片?
【发布时间】:2019-05-14 15:17:22
【问题描述】:

我必须在 ionic-4 中自动播放离子幻灯片。但它不起作用。我试过了,请参考下面的代码

我用过 autoplay="true" 但还是不行。

.html

<div>  
        <ion-slides [options]="sliderConfig">
          <ion-slide *ngFor="let cat of latestProducts">
            <div class="slide-content">
              <ion-card>
                <ion-card-header>
                  <ion-card-title class="card-title">
                      {{cat.post_title}}
                  </ion-card-title>
                  <ion-card-content>
                    <img class="image-wrap" src="{{cat.post_image_url}}">
                  </ion-card-content>
                </ion-card-header>
              </ion-card>
            </div>
          </ion-slide>
        </ion-slides>
      </div>

.ts

sliderConfig = {
    initialSlide: 0,
    speed: 400,
     slidesPerView: 1.45,
     autoplay: true,
  };

  @ViewChild(IonSlides) slides: IonSlides;
slidesDidLoad(slides: IonSlides) {
    slides.startAutoplay();
  }

我想自动播放幻灯片。

【问题讨论】:

    标签: ionic-framework ionic4 autoplay ion-slides


    【解决方案1】:

    你可以试试这个吗?

       <ion-slides #mySlider (ionSlidesDidLoad)="slidesDidLoad(mySlider)">
          ...
        </ion-slides>
    
    
        slidesDidLoad(slides: Slides) {
          slides.startAutoplay();
        }
    

    然后你可以看到 https://github.com/ionic-team/ionic/issues/15046

    【讨论】:

    • 我用过这个,但是一次它可以工作,然后在第二次编译它停止后再次工作,实际上我使用三个滑块,只有一个滑块我需要 autoplay="true",但是一旦它开始再次编译后停止
    • 你点击链接了吗?
    • 是的,我点击了链接,但我的问题仍未解决。
    猜你喜欢
    • 2017-10-19
    • 1970-01-01
    • 2012-04-07
    • 2017-12-10
    • 2015-12-01
    • 1970-01-01
    • 2013-11-24
    • 1970-01-01
    • 2021-10-04
    相关资源
    最近更新 更多