Ionic 4 ion-slides slideOptions 第二次忽略

Question

我的 Ionic 4 应用程序有一个奇怪的行为：当我第二次打开带有幻灯片的模式时，我的 slideOptions 被忽略（第一次完美运行）

这是一些代码

my-card.component.ts ：

async openDetail(): Promise<void> {
  const detailModal = await this.modalController.create({
    component: DetailsComponent,
    componentProps: {
      somePros: '...'
    }
  });

  return detailModal.present();
}

details.component.ts ：

export class DetailsComponent implements OnInit {

  slideOptions = null;

  ngOnInit() {

    // [...]

    let initialSlide = 0;

    // [...]

    this.slideOptions = { initialSlide };
  }
  ...
}

details.component.html：

<ion-content>

  [...]

  <ion-slides *ngIf="slideOptions" [options]="slideOptions">
    <ion-slide>
      [...]
    </ion-slide>
    [...]
  </ion-slides>
</ion-content>

Answer 1

显然我需要更新幻灯片才能正常工作

details.component.ts ：

export class DetailsComponent implements OnInit {

  slideOptions = null;

  // ===> Get the reference on the slides here <===
  @ViewChild('slides', {static: true}) slides: IonSlides;

  ngOnInit() {

    // [...]

    let initialSlide = 0;

    // [...]

    this.slideOptions = { initialSlide };

    // ===> Update the slides here <===
    this.slides.update();
  }
  ...
}

details.component.html：

<ion-content>

  [...]

  <!-- ===> Add #slides here <=== -->
  <ion-slides #slides *ngIf="slideOptions" [options]="slideOptions">
    <ion-slide>
      [...]
    </ion-slide>
    [...]
  </ion-slides>
</ion-content>