IONIC:ion-List在iPhone中显示空白项目

时间:2018-12-13 12:28:05

标签: cordova ionic-framework mobile ionic3

我正在使用Ionic3 + AngularJS构建一个混合应用程序,而我一直坚持下去:

我的视图中有以下列表( Home.html ):

<ion-content overflow-scroll="true">
  <ion-item text-center *ngIf="pedidos.length==0">
    <p>Nothing here!</p>
  </ion-item>
  <ion-list *ngIf="pedidos.length > 0">
    <ion-item-sliding *ngFor="let ped of pedidos; let i = index">
        <ion-item (click)="doSomething(ped)">              
            <ion-row>
              <ion-col col-2 align-self-center *ngIf="ped.cod!=0">                
                  Cód.<br><b>{{ped.cod}}</b>
              </ion-col>
              <ion-col col-2 align-self-center *ngIf="ped.cod==0">                
                  No<br>Cód.
              </ion-col>
              <ion-col col-10 align-self-left>
                <ion-row>
                  <ion-col text-wrap>
                      <h2 text-wrap><b>{{ped.name}}</b></h2>
                  </ion-col>                      
                </ion-row>
                <ion-row>
                  <ion-col align-self-left>
                      <p>Qtd: {{ped.qtd==""?"0":ped.qtd}}</p>
                  </ion-col>
                  <ion-col align-self-left>
                      <p>Price: {{ped.price| currency:'BRL'}}</p>
                  </ion-col>
                </ion-row>
                <ion-row>                   
                  <ion-col align-self-right>
                      <p class="fonte">Date: {{ped.datePed| date:'dd/MM/yyyy'}}</p>
                  </ion-col>
                </ion-row>                
              </ion-col>
            </ion-row>              
        </ion-item>
    </ion-list>
</ion-content>

并在控制器( Home.ts )中:

export class Home implements OnInit{
    public pedidos : Pedido[] = [];
    constructor(...){}

    ionViewDidEnter(): void {
        initList();
    }

    initList(): void {
        this.pedProvider.getAllPed(id)
          .subscribe((res: Pedido[])=>{    
             if(res.length>0){               
                this.pedidos = res;
             }                                              
        });
    }
}

当我在 iPhone 中运行该应用程序时,发生了这种情况: enter image description here 仅前两个项目可见,其他项目正在加载空白。 这仅在iPhone中发生,在Android设备上一切正常!

我已经尝试在ngOnInit()和ionViewWillEnter()中调用initList(),但问题仍然存在,没有任何改变。

我试图寻找解决方案,但没有任何帮助。有什么想法吗?

0 个答案:

没有答案