时间戳

首页 > 解决方案 > 如何使用 if else 语句来回切换图像？

ionic3 - 如何使用 if else 语句来回切换图像？

问题描述

大家好，我不想使用 if else 语句来回切换建筑布局图像到建筑设计图像，但我不知道如何实现它。我是这种类型脚本的新手，有人愿意分享答案吗？

感谢您的高级回答

在此处输入图像描述

标签： ionic3

解决方案

这是一个通过动作切换图像的示例组件：

组件的 HTML：

<ion-list>
      <ion-item *ngIf="showImage1">
          <img src="../assets/imgs/dots.gif" height="50px" width="50px" >
     </ion-item>
      <ion-item *ngIf="showImage2">
          <img src="../assets/imgs/dots.gif" height="50px" width="50px" >
     </ion-item>
</ion-list>
<ion-button (click)="DoHideImage1()"  expand="block" color="light">
  Image2
</ion-button>
<ion-button (click)="DoHideImage2()"  expand="block" color="light">
  Image1
</ion-button>

Typescript of component:
________________________________________

public showImage1: boolean;
public showImage2: boolean;

constructor() {
  this.showImage1 = true;
  this.showImage2 = false;
}

DoHideImage1(){  
      this.showImage1 = false;
      this.showImage2 = true;
 };
DoHideImage2(){  
      this.showImage1 = true;
      this.showImage2 = false;
 };

*ngIf 在条件下隐藏！根据您的需要修改示例！

推荐阅读