離子幻燈片不顯示圖像

Question

我正在使用離子和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>