Ошибка: необходимо указать значение для управления формой по индексу: 1 - PullRequest
Новая
       46

Ошибка: необходимо указать значение для управления формой по индексу: 1

0 голосов
/ 07 сентября 2018

Я использую реактивные формы с матовым автозаполнением. Я использовал автозаполнение в других частях моего приложения, но я не могу понять это. У меня есть formarray, который добавляет вход каждый раз, когда я хочу добавить новый датчик в моем случае .autocomplete отлично работает в моем первом входе, но когда я пытаюсь добавить больше входов, появляется ошибка: Ошибка: необходимо указать значение для управления формой с индексом: 1

HTML: 

<div class="row">
    <div class="input-field col s10">
      <div class="form-group">
        <div formArrayName="sensors_id">
          <div *ngFor="let sensor of addHomeboxPForm.get('sensors_id')['controls']; let i = index">
            <br>
            <input formControlName="{{i}}" type="text" placeholder="Select Sensor" aria-label="Number" matInput [matAutocomplete]="auto1">
            <mat-autocomplete autoActiveFirstOption #auto1="matAutocomplete" [displayWith]="displayWith" >
              <mat-option (onSelectionChange)="updateForm($event, [sensor.sensors_id], 'sensors_id')" *ngFor="let sensor of filteredOptionsS | async" [value]="sensor.sensor_serial">
                {{sensor.sensor_serial}}
              </mat-option>
            </mat-autocomplete>
            <div class="button-left">
              <button *ngIf="addHomeboxPForm.controls.sensors_id.value.length > 1" type="button" class="fa" (click)="onRemoveItem(i)">RemoveSensor</button>
            </div>
          </div>
        </div>
      </div>


<div class="input-field col s2">
        <button type="button" class="btn" (click)="onAddItem()">AddSensor</button>
      </div>

TS:

formarray: 'sensors_id': this.fb.array([], Validators.required),

  updateForm(ev: any, idd: any, componentid: any) {

    if (ev.isUserInput) {
      if (componentid === 'sensors_id') {
        this.sensorId = idd;
        this.addHomeboxPForm['controls']['sensors_id'].setValue([ev.source.value])
      }
    }
  }

  onAddItem() {
    (<FormArray>this.addHomeboxPForm.controls['sensors_id']).push(new FormControl('', Validators.required));
  }

  onRemoveItem(index: number) {
    (<FormArray>this.addHomeboxPForm.controls['sensors_id']).removeAt(index);
  }

Я новичок в этом, поэтому прошу прощения, если я не так ясно .. но я еще не нашел решение

1 Ответ

0 голосов
/ 08 ноября 2018

ваше fortmcontrolName должно быть определено в вашем компоненте перед использованием его в шаблоне html.

Я вижу, вы использовали <input formControlName="{{i}}", что недопустимо, так как Angular не может найти это поле formControl /, в котором реактивная форма была объявлена ​​изначально.

После создания элемента управления в классе компонента его необходимо связать с элементом элемента управления формы в шаблоне. Обновите шаблон с помощью элемента управления формы, используя привязку formControl, предоставленную FormControlDirective, включенную в ReactiveFormsModule.

Подробнее о реактивных формах можно прочитать здесь:

Надеюсь, это поможет.

...