Блог

Я пытаюсь динамически устанавливать FormControlNames для списков выбора в реактивной форме, но вместо formControlName я получаю ng-reflect-name .

Мой HTML-код выглядит следующим образом, и я устанавливаю formControlName и ID в моих списках выбора на одно и то же значение только для подтверждения:

 <div *ngFor="let questionOption of questionOptions; let i = index">
    <select [id]="questionOption['control']" [formControlName]="questionOption['control']">
    <option *ngFor="let option of questionOption['options']"> {{ option }} </option>
    </select>
</div>
 

И на этом изображении показано, что ng-reflect-name выводится вместо ожидаемого formControlName:

Что я могу попытаться решить?

Обновить:

Я также обнаружил, что мои списки выбора не отражают выбранный мной вариант. Все мои параметры видны, когда я нажимаю на свой список, я выбираю желаемый вариант, но отображаемый вариант остается неизменным. Однако, когда форма отправляется, мой консольный вывод отображает выбранный вариант. На следующем рисунке справа показаны 2 списка выбора, в которых я выбрал разные параметры и отправил форму. В выводе консоли слева отображаются выбранные и отправленные значения.