Блог

Главная - Вопросы по программированию - Лучшая практика обновления значения при размытии с использованием реактивных форм в angular

Лучшая практика обновления значения при размытии с использованием реактивных форм в angular

#angular #angular2-forms

#angular #angular2-forms

Вопрос:

Какова наилучшая практика обновления <input/> значения с использованием реактивных форм Angular?

У меня есть 2 FormGroup.

во-первых, FormGroup имеет blur событие, которое обновит входной тег во второй FormGroup

 <input
   class="form-control"
   id="bill_firstname"
   type="text"
   name="firstname"
   formControlName="firstname"
   autocomplete="off"
   placeholder="Corporate"
   (blur)="onBlurTest($event)"
 />

вторая группа форм:

 <input
  class="form-control"
  id="doc-first-name"
  type="text"
  name="doctor"
  formControlName="docFirstName"  
  autocomplete="off"
  placeholder="First Name"
  [(value)]="test"
  />

и в моем .ts файле я настроил это следующим образом.

  test = '';

  onBlurTest(e) {
    this.test = e.target.value;
    this.companySignUpForm.value.user.docFirstName = e.target.value;

  }

есть ли правильный способ сделать это? или это приемлемо?

Спасибо.

Комментарии:

1. Нет необходимости использовать this.test = e.target.value; вы можете напрямую установить значение с помощью (this.companySignUpForm.controls["user"] as FormGroup).controls["docFirstName"].value = e.target.value

2. или вы можете использовать [(ngModel)] = "test" во втором элементе управления «docFirstName» и установить this.test = e.target.value; внутри onBlurTest(e)

Ответ №1:

Чтобы изменить значение FormControl, вам необходимо использовать API FormControl. Один из вариантов: 

 onBlurTest(e) {    
   this.companySignUpForm.get('use.docFirstName').patchValue(e.target.value)
}