离子框架幻灯片组件“循环”选项

Question

我目前正在使用 Ionic-Angular 开发应用程序。 对于幻灯片，我使用的是 ionic 4 ion-slides 组件，一切正常，但我一直在寻找一种循环播放幻灯片的方法，以便用户可以根据 ionic docs => ion-slides在数组末尾进行滑动而不锁定

和刷卡器 API

我可以通过在选项中使用循环属性来实现这一点，所以我按照说明进行操作，但它似乎不起作用并且数组末尾的滑动锁我的 HtMl 代码是：

<ion-slides #theSlides [options]="slideOpts"   id="peerSlide">
    <ion-slide *ngFor="let peer of peers;let i = index">
       <img id="{{'x' + i}}" class="peerIcon" [src]="peer.icon" >
     </ion-slide>
</ion-slides>
<img class="nextIcon" src="../../assets/imgs/nextIcon/nextIcon@3x.png" (click)="moveToNext(theSlides)">
<img class="prevIcon" src="../../assets/imgs/prevIcon/prevIcon@3x.png" (click)="moveToPrev(theSlides)">

和 my.ts 文件：

export class LivePage implements OnInit {
  @ViewChild('theSlides' , {  static: true }) slides: IonSlides;
 
  slideOpts = {
  loop: true,
   };

  ...
  moveToNext(slides) {
   slides.slideNext()
  }
  moveToPrev(slides) {
   slides.slidePrev()
  }
 }

如果您能说出我的代码有什么问题，我将不胜感激。谢谢。

更新：当我尝试使用 ngFor 时，循环可以正常工作，但使用 ngFor 则不行

Answer 1

它对我有用相同的代码 ("@ionic/angular": "^5.0.0") 尝试更新你的依赖关系