在离子滑块中获取 getActiveIndex 错误

如何解决在离子滑块中获取 getActiveIndex 错误

我只有 5 张图片及以下配置

 slideOpts = {
    slidesPerView: 4.25,centeredSlides: true,initialSlide: 2,speed: 400,centeredSlidesBounds: true,spaceBetween: 0,loop: true
  };

现在当我滑动到已选择的滑动值时

 getSlideIndex(){
   this.slides.getActiveIndex().then(
     (index)=>{
       this.currentIndex = index;
    });
  }

HTML

 <ion-slides [options]="slideOpts" (ionSlideDidChange)="getSlideIndex()"
                  [ngClass]="{'cs-slider-loaded': slidesEnabled}">
                  <ion-slide *ngFor="let s of slidesItems">
                    <div class="main-wrap">
                      <div class="loading-image">
                        <div class="img-shadow"></div>
                        <div class="game-react" *ngIf="s.sideImg">
                          <img src="{{s.sideImg}}" />
                        </div>
                        <img src="{{s.image}}" class="slidemain_img" alt="" />
                      </div>
                    </div>
                  </ion-slide>
                </ion-slides>

这里的 this.currentIndex 是错误的，我有时会得到 12、11、9、7，而我只有 5 张图像在循环中

解决方法

Ionic 事件的错误实现，需要使用事件对象。

getSlideIndex(event) {
  event.target.getActiveIndex().then(
    (index)=>{
      this.currentIndex = index;
    });
}

HTML

<ion-slides [options]="slideOpts" (ionSlideDidChange)="getSlideIndex($event)"
...