Question

在我的项目中，我使用本机存储

this.platform.ready().then((readySource) => {
      console.log('Platform ready from', readySource);
      this.nativeStorage.getItem('Arrivaldetails')
        .then(
          data =>{
            //alert(JSON.stringify(data.arrivaltime));

            this.getFlightDetails(data.fligtdetails,data.arrivaltime,data.departuretime);
          },


          error => console.error(error)

        );
    });

我想检查本机存储是否为空。如果它为null，我想隐藏离子卡并显示文本视图和如果不为null我想显示离子卡并隐藏文本视图

<ion-card">

    <ion-card-content>
      <p><span>{{FullDetails.departureAirportFsCode}}</span></p>

    </ion-card-content>

Answer 1

您可以使用其他变量来检查它是否为空。

let showData: boolean = false;

你的功能应该是

this.platform.ready().then((readySource) => {
    console.log('Platform ready from', readySource);
    this.nativeStorage.getItem('Arrivaldetails')
    .then(data => {
        if (data){                
            this.showData = true;
            this.getFlightDetails(data.fligtdetails,data.arrivaltime,data.departuretime);
        }
        else 
            this.showData = false;
    },error => {
        console.error(error);     
    });
});

然后在HTML中您可以使用：

<ion-card *ngIf="showData">
    <ion-card-content>
      <p><span>{{FullDetails.departureAirportFsCode}}</span></p>
    </ion-card-content>
</ion-card>
<div *ngIf="!showData">
   your text here
</div>

我希望它有所帮助。

如何设置离子卡的可见性？

1 个答案: