ionic3 ion-sliders 組件的使用

html 部分：

<!--S banner-->
    <ion-slides #slider pager loop="true" autoplay="2500" speed="500" *ngIf="banners.length">
        <ion-slide *ngFor="let banner of banners" [ngStyle]="{'background' : 'url(' + banner.pic + ')'}" width="100%">
        </ion-slide>
    </ion-slides>
    <!--E banner-->

 ts 部分：

import { NavController, IonicPage ,Slides } from 'ionic-angular';

 @ViewChild('slider') slider: Slides;

//輪播圖數組數據
  banners: any = [1,2,3,4];

//進入頁面時自動播放
  ionViewDidEnter() {
    //修復輪播手動滑動後不能自動輪播問題
    setTimeout(()=>{
      console.log(this.slider);
      this.slider.autoplayDisableOnInteraction = false; 
      if(this.banners.length>1){
        this.slider.startAutoplay();
      }
    },1000);
    
  }

   //頁面離開時停止自動播放
   ionViewDidLeave(){ 
    if(this.banners.length>1){
      this.slider.stopAutoplay();
    }
  }

其中， this.slider.startAutoplay(); 和 this.slider.stopAutoplay(); 是解決當頁面離開該頁進入其他頁面 再返回時，slides不輪播的問題

this.slider.autoplayDisableOnInteraction = false;  是解決，當手指觸碰之後，輪播停止的問題