Question

我正在使用2个离子晶圆厂按钮，一个用于批准用户的详细信息，另一个用于拒绝用户的详细信息。我正在使用两个按钮，如下所示：

  <ion-fab right   #fab>
    <button *ngIf="hideButton" ion-fab mini class="fab-mini-style" (click)="approve()" >
          <ion-icon style="color:#006400" name="checkmark"></ion-icon>
    </button>
 </ion-fab>
 <ion-col col-2 *ngIf = "false">
      <ion-fab right   #fab>
          <button *ngIf="hideButton" ion-fab mini class="fab-mini-style" (click)="reject()" >
                <ion-icon style="color:red" name="close"></ion-icon>
           </button>
       </ion-fab>
 </ion-col>

在我的TS文件中，同时使用以下两种方法：

approve(){
    this.message.alert("Congrats! Your account has been approved")
}
reject(){
    this.message.alert("Sorry your account has not been approved")
}

即使单击任意一个按钮，如何隐藏两个按钮？即，即使我也单击批准按钮，两个按钮都应该隐藏，或者即使我也单击取消按钮，两个按钮都应该隐藏。我该如何实现？

Answer 1

尝试这样

<ion-fab right   #fab>

    <button *ngIf="hideButton" ion-fab mini class="fab-mini-style" (click)="Approve()" >
          <ion-icon style="color:#006400" name="checkmark"></ion-icon>
    </button>
 </ion-fab>
 <ion-col col-2 *ngIf = "false">
      <ion-fab right   #fab>

          <button *ngIf="hideButton" ion-fab mini class="fab-mini-style" (click)="Reject()" >
                <ion-icon style="color:red" name="close"></ion-icon>
           </button>
       </ion-fab>
 </ion-col>

在您的.ts文件中

hideButton:boolean = true;

approve(){
  if(this.hideButton){
      this.hideButton = false;
  }
    this.message.alert("Congrats! Your account has been approved")
  }
cancel(){
   if(this.hideButton){
       this.hideButton = false;
   }
   this.message.alert("Sorry your account has not been approved")
 }

注意：请添加您的业务逻辑以使按钮可见。

单击单个按钮时如何隐藏2离子按钮？

1 个答案: