Angular р-вход переключается при загрузке страницы

Question

У меня есть переключатель ввода на моем сайте:

<label>Bonus</label>
<p-inputSwitch formControlName="bonus"
  (onChange)="clickBonusChecked($event)"
  onLabel="yes"
  offLabel="no">

<p class="text-small" *ngIf="checked">Information about the bonus</p>

Я хочу, чтобы текст маленького размера отображался при проверке переключателя ввода. Это работает, но не при загрузке страницы, и вход уже проверен. Он просто показывает «да», а не текст. Когда я ставлю «нет», а затем «да», появляется текст. Что я делаю не так?

Answer 1

Поскольку вы используете реактивную форму, вам не нужно использовать clickBonusChecked($event). Вы можете напрямую указать значение из bonus в *ngIf. Таким образом, всякий раз, когда форма загружается со значением да, она будет показывать бонусный элемент. Код будет выглядеть так:

     <form [formGroup]="form" >
       <p-inputSwitch  formControlName="bonus"  onLabel="yes"
  offLabel="no"></p-inputSwitch>
    <p class="text-small" *ngIf="form.value.bonus">Information about the bonus</p>
     </form>