forms - 错误设置表单数组只带来第一个值

Question

我找不到在我的表单中设置值的问题。它只给我带来了第一个值，错误是 ERROR 错误：在 FormArray._throwIfControlMissing 的索引 1 处找不到表单控件。有谁知道正确的方法是什么？

在我的组件中

  public setValueForm(): void {

const values = {
  '_id': this.priceList._id,
  'name': this.priceList.name,
  'percentage' : this.priceList.percentage,
  'allowSpecialRules' : this.priceList.allowSpecialRules,
  'rules' : this.priceList.rules || []
};

this.priceListForm.setValue(values);
}

和我的html

<div class="row tab-content">
          <div formArrayName="rules" *ngFor="let rule of priceListForm.get('rules').controls; let i = index;">
            <div [formGroupName]="i">
              <div class="row">
                <div class="form-group col-md-4">
                  <label for="category" class="control-label">Rubro:</label>
                  <select class="form-control" formControlName="category">
                    <option *ngFor="let category of categories"
                            [value]="category._id"
                            [disabled]="readonly">
                            {{category.description}}
                    </option>
                  </select>
                </div>
                <div class="form-group col-md-4">
                  <label for="make" class="control-label">Marca</label>
                  <select class="form-control" formControlName="make">
                    <option *ngFor="let make of makes"
                            [value]="make._id"
                            [disabled]="readonly">
                            {{make.description}}</option>
                  </select>
                </div>
                <div class="form-group col-md-3">
                  <label for="percentage" class="control-label">Porcentaje:</label>
                  <div class="input-group">
                    <input type="number" class="form-control" formControlName="percentage" name="percentage" id="percentage" [readonly]="readonly"/>
                  </div>
                  <div *ngIf="formErrors.percentage" class="alert alert-danger">
                    {{ formErrors.percentage }}
                  </div>
                </div>
                <div class="col-md-1">                      
                    <label class="control-label">Acción:</label>
                    <button type="button" class="btn btn-success btn-sm" (click)="addRule()">
                        <i class="fa fa-plus"></i>
                    </button>
                    <button type="button" class="btn btn-danger btn-sm" (click)="deleteRule(i)">
                        <i class="fa fa-trash-o"></i>
                    </button>
                </div>

              </div>
            </div>  
          </div>
        </div>

标签： formsangular2-formsformarray

Answer 1

解决

    let control = <FormArray>this.priceListForm.controls.rules;
this.priceList.rules.forEach(x => {
  control.push(this._fb.group({ 
    '_id': x._id, 
    'percentage': x.percentage,
    'make' : x.make,
    'category' : x.category
  }))
})