离子载玻片不显示图像

Question

我正在使用 ionic 和 firebase。当我尝试加载带有离子幻灯片的页面时。即使等了一会儿，图像也没有显示。例如，如果我在 img 标签中显示图像，效果很好：

<div style="width:100%; height:150px;> 
  <img src={{data.image1}}>
</div>

但是当我在像下面这样的离子幻灯片中尝试同样的方法时，即使在页面上停留了很长时间，它也没有显示图像。它仅显示我是否返回并再次返回页面。

<ion-slides  class="slider" pager="true" paginationType="bullets">
  <ion-slide>
            <img src="{{data.image1}}" (click)="expand_image(data.image1)">

  </ion-slide>
  <ion-slide *ngIf='data.image2'>
            <img src="{{data.image2}}" (click)="expand_image(data.image2)">
  </ion-slide>

    <ion-slide *ngIf='data.image3'>
            <img src="{{data.image3}}" (click)="expand_image(data.image3)">
  </ion-slide>

    <ion-slide *ngIf='data.image4'>
            <img src="{{data.image4}}" (click)="expand_image(data.image4)">
  </ion-slide>

    <ion-slide *ngIf='data.image5'>
            <img src="{{data.image5}}" (click)="expand_image(data.image5)">
  </ion-slide>


    <ion-slide *ngIf='data.image6'>
            <img src="{{data.image6}}" (click)="expand_image(data.image6)">
  </ion-slide>

    <ion-slide *ngIf='data.image7'>
            <img src="{{data.image7}}" (click)="expand_image(data.image7)">
   </ion-slide>

    <ion-slide *ngIf='data.image8'>
            <img src="{{data.image8}}" (click)="expand_image(data.image8)">
    </ion-slide>

    <ion-slide *ngIf='data.image9'>
            <img src="{{data.image9}}" (click)="expand_image(data.image9)">   
    </ion-slide>


    <ion-slide *ngIf='data.image10'>
            <img src="{{data.image10}}" (click)="expand_image(data.image10)">
  </ion-slide>


</ion-slides>

Answer 1

you can try this
  <ion-slide-box options="options" slider="data.slider" class="clubslide">
        <ion-slide style="color: white;">
          <img class="full-image" src="{{data.image1}}">
        </ion-slide>
       <ion-slide style="color: white;">
          <img class="full-image" src="{{data.image2}}">
        </ion-slide>
        <ion-slide style="color: white;">
          <img class="full-image" src="{{data.image3}}">
        </ion-slide>
      </ion-slide-box>

离子载玻片不显示图像

Ion slides not showing images

image

loading

ionic-framework