离子图像滑块未在iOS上加载

I have an ionic app containing an image slider which uses the ion-slides component to provide slides between images retrieved from url's.

我有一个包含图像滑块的离子应用程序，该滑块使用离子滑块组件在从网址检索到的图像之间提供幻灯片。

My problem is that the images display correctly on Android, but on iOS the images do not display, only when rotating the device to landscape do the images appear and then also work in portrait mode.

我的问题是图像在Android上正确显示，但在iOS上图像不显示，只有在将设备旋转到横向时才会显示图像，然后才能以纵向模式工作。

Any advice on how to make the images appear correctly on iOS?

有关如何在iOS上正确显示图像的任何建议吗？

Below is my code sample:

以下是我的代码示例：

<ion-content padding>
  <ion-slides pager
  #imageSlider>
    <ion-slide *ngFor='let url of imageUrls'>
      <ion-img [src]='url'></ion-img>
    </ion-slide>
  </ion-slides>
</ion-content>

In the typescript file, imageUrls is an array of type string, containing URL's for the images to load.

在typescript文件中，imageUrls是一个string类型的数组，包含要加载的图像的URL。

1 个解决方案

#1

I found the solution.

我找到了解决方案。

Changed <ion-img> to just a normal img
将更改为普通的img
In typescript file, added the following to ionViewCanEnter:

在typescript文件中，将以下内容添加到ionViewCanEnter：
```
@ViewChild('imageSlider') slider: Slides;

...

ionViewCanEnter() {
   this.slider.centeredSlides = true;
}
```

The images now load on iOS.

图像现在加载到iOS上。

Template sample:

模板样本：

<ion-content padding>
   <ion-slides pager
   #imageSlider>
   <ion-slide *ngFor='let url of imageUrls'>
      <img [src]='url'>
   </ion-slide>
   </ion-slides>
</ion-content>

#1