获取 formArray Angular 中的值：找不到带路径的控件

Question

我想在 formArray 中获取我的简单表单上的值，但它给我错误。我已经尝试过其他解决方案，例如，但它不起作用。

这是我的示例代码：https://stackblitz.com/edit/angular-get-array-values

    ----- HTML
<div class="form-group" formArrayName="optionGroup">
   <div *ngFor="let data of menuOptions; let i = index">
                    <div [formGroupName]="i" class=" " id="{{i}}">
                      <input
                        formControlName="optionsQty"
                        class="form-input qty qty{{i}}"
                        type="number"
                        id="qty{{i}}"
                        min="1"
                        [(ngModel)]="defaultOptionQtyTotal"
                      />
        
                      <input
                        formControlName="optionsName"
                        class="form-input"
                        type="text"
                        readonly
                        value=" {{data.name}} {{i}}"
                        id="optName{{i}}"
                      />
        
                      $<input
                        formControlName="optionsCost"
                        class="form-input"
                        type="text"
                        readonly
                        value=" {{data.cost}}"
                        id="optName{{i}}"
                      />
                    </div>
            </div>

这是.TS

----- TS
 constructor(private builder: FormBuilder) {
    this.form = this.builder.group({
      qtyTotal: this.builder.control("", [
        Validators.required,
        Validators.min(1)
      ]),

      optionGroup: this.builder.array([]);
     });
  } //end constructor

Answer 1

您可以在 class 中初始化表单数组。

ngOnInit() {
  this.initFormArray();
}

initFormArray() {
    this.menuOptions.forEach(x => {
      (<FormArray>this.form.get("optionGroup")).push(
        this.builder.group({
          optionsQty: [null],
          optionsName: [x.name],
          optionsCost: [x.cost]
        })
      );
    });
  }

您遇到了问题，因为您尝试访问 HTML 中的空表单数组。

已更新solution.

获取 formArray Angular 中的值：找不到带路径的控件

Get values in formArray Angular: Cannot find control with path

angular

formarray