Блог

Главная - Вопросы по программированию - Ошибка: Не удается найти элемент управления с путем: ‘FormArray -> formControlName’ Угловой

Ошибка: Не удается найти элемент управления с путем: ‘FormArray -> formControlName’ Угловой

#angular #formarray #reactive-forms #form-control

Вопрос:

Это структура моей формы:

 this.formData = new FormGroup({
  selectedAnimal: new FormArray([], [Validators.required]),
  selectedTransport: new FormArray([], [Validators.required]),
  roadName: new FormControl({ disabled: true, value: null }, Validators.required),
  roadZip: new FormControl({ disabled: true, value: null }, Validators.required),
  planeName: new FormControl({ disabled: true, value: null }, Validators.required),
  planeZip: new FormControl({ disabled: true, value: null }, Validators.required)
});

Соответствующий HTML

 <form [formGroup]="formData" (ngSubmit)="onSubmit()">
  <div class="animal-checkbox-group" formArrayName="selectedAnimal">
    <!-- multiple checkbox options, selecting one is mandatory -->
  </div>

  <div class="animal-checkbox-group" formArrayName="selectedTransport">
    <!-- multiple checkbox options, selecting one is mandatory -->
    <div class="if-checkbox-1-selected">
      <!-- conditional checkbox: if checkbox is selected -> new new form controls -> they should be defined for successful validation -->
      <input type="text" formControlName="roadName">
    </div>
  </div>
</form>

ошибка:

ОШИБКА Ошибка: Не удается найти элемент управления с путем: ‘Выбранный транспорт -> Имя дороги’

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

1. Это потому formControlName="roadName" , что находится в стадии selectedTransport оформления. Вам нужно либо изменить структуру вашего html formControlName="roadName -кода, чтобы он находился под [formGroup]="formData" управлением, либо переместить элементы управления в массив форм и зациклить их в шаблоне

Ответ №1:

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

 <div [formGroup]="formData">
    Road Name: <input type="text" formControlName="roadName">
</div>

Вот рабочий код : stackblitz

Метки: