Скрыть динамически вводы и метки

Question

У меня есть 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, но у меня ничего не получилось. Я также попытался сделать это в компоненте, но ничего: (

Спасибо!

Answer 1

Вы можете попробовать это, не используя другую переменную в машинописи, получив значение из элемента управления формы

Отклонение

Answer 2

Попробуйте это

Измените searchValues ​​на (change) = "searchValues ​​($ event)" Add

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>

Надежда полезна