时间戳

首页 > 解决方案 > 动态隐藏输入和标签

angular - 动态隐藏输入和标签

问题描述

我有一个包含大量输入和标签的 html。如果选择选项的文本是“接受”，我想隐藏或显示某些字段。

我有这个：

  <label for="result">Result</label><br/>
  <select formControlName="result" (change)="searchValues()">
    <option *ngFor="let result of result" >{{result.description}}</option>
  </select><br/><br/>

  <label for="resultreason" hidden>Rejection</label><br/>
  <select formControlName="resultreason" >
    <option *ngFor="let resultreason of resultreason" >{{resultreason.description}}</option>
  </select><br/><br/>

我想要的是：如果结果选择是接受，我想隐藏标签“resultreason”。如果结果不接受，则使其可见。

我读过关于用 ngif 或 ngshow 来做这件事，但我没有成功。我也尝试在组件中这样做，但没有:(

谢谢！

标签： angular

解决方案

尝试这个

将 searchValues 更改为 (change)="searchValues($event)" 添加

showReason = true;


searchValues({value}) {
  this.showReason = value !== 'accept';
}

将此添加到您的类组件中

在你的 HTML

<div *ngIf="showReason">
  <label for="resultreason" hidden>Rejection</label><br/>
  <select formControlName="resultreason" >
    <option *ngFor="let resultreason of resultreason" >{{resultreason.description}}</option>
  </select><br/><br/>
</div>

希望有用

推荐阅读