You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在TypeScript中实现按钮点击后隐藏(新手求助)

解决方法

你代码里有两个核心问题导致功能失效:

  • 初始isValid设为false,按钮一开始就不会显示,得改成true才能让按钮默认展示
  • hi方法里没有对isValid做赋值操作,点击后不会触发状态变更

修改后的代码如下:

HTML 部分

<button mat-icon-button matTooltip="hi" *ngIf="isValid" (click)="hi(x, y)">
  <!-- 可添加按钮图标或文本,例:<mat-icon>info</mat-icon> -->
</button>

TypeScript 部分

isValid: boolean = true; // 初始设为true,让按钮默认显示

hi(x, y){
  // 保留你原本需要处理的x、y逻辑
  this.isValid = false; // 点击后将状态设为false,按钮会被*ngIf隐藏
}

如果之后需要重新显示按钮,只需在对应逻辑里将isValid重新设为true即可。

内容的提问来源于stack exchange,提问作者user14431937

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.04 23:40:23