Угловой 11 заполнение ввода в HTML

#html #angular #angular11

Вопрос:

Я столкнулся с проблемой, в основном я не могу заполнить значение во входных данных, но в HTML. Я искал, но, кажется, ничего не работает. Я пробовал значения, (value) , [(value)] , "k.bag.ConstructionYear" , "{{k.bag.ConstructionYear}}" и другие комбинации, и, похоже, ничего не работает.

mycomponent.html

 <ng-container
  *ngIf="{
    // other stuff
    firstStepState: firstStepState$ | async
  } as o"
>
  //........
  <ng-container *ngIf="{
          bag : testService.getData(o.firstStepState.value1, o.firstStepState.value2) | async
        } as k">

    <ng-container *ngIf="k.bag !== undefined amp;amp; k.bag !== null">
    {{k.bag.ConstructionYear}} // <-- this is showing 

    <input
        type="text"
        name="constructionYear"
        formControlName="constructionYear"
        id="constructionYear"
        data-test="constructionYear"
        placeholder=""
        [value]="k.bag.ConstructionYear" <-- this is the problem
    />
    
 

Ответ №1:

назначая formControlName="constructionYear" входные данные, вы делегируете управление значениями этих входных данных своему FormControl. с этого момента вы должны обновлять логическую форму из своего кода ts всякий раз, когда захотите, а не значение входных данных. например, с помощью метода control.setValue(newValue)

Ответ №2:

 <input
    type="text"
    name="constructionYear"
    formControlName="constructionYear"
    id="constructionYear"
    data-test="constructionYear"
    placeholder=""
    [(ngModel)]="k.bag.ConstructionYear"
/>
 

для привязки к вашим данным

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

1. Не смешивайте модели реактивных форм с моделями шаблонных форм. т. е. атрибут formControlName и ngModel атрибут не должны находиться в одном элементе.