Question

我构建了以下formarray，复选框显示在html一侧，但是我无法对其进行检查。我正在从API调用中获取数据，该调用告诉我应该检查的复选框的ID。

    this.ruleAssignmentFormGroup = this.formBuilder.group({
  REFERENCE_ID: this.detail.REFERENCE_ID,
  TITLE: new FormControl(this.detail.TITLE),
  allRulesArray: this.formBuilder.array([])
});

通过循环显示给用户（无论是否选中）的所有复选框来填充allRulesArray

        let rulesControl = <FormArray>this.ruleAssignmentFormGroup.controls.allRulesArray;
    data.LOOKUP_RULES.forEach(x => {
      rulesControl.push(new FormControl({
        DESCRIPTION: x.DESCRIPTION,
        RULE_LOOKUP_ID: x.RULE_LOOKUP_ID,
        Selected: new FormControl(true)
      }));
    });

到目前为止，

html是：

  <form [formGroup]="ruleAssignmentFormGroup" autocomplete="false" novalidate class="form-horizontal">
<div class="card-body form-styles">
  <div class="row">
    <div class="col-md-6">
      <div class="form-group">
        <label>{{ruleAssignmentFormGroup.controls['TITLE'].value}}</label>
      </div>
      <div formArrayName="allRulesArray">
        <div class="form-group">
          <div *ngFor="let item of ruleAssignmentFormGroup.controls['allRulesArray'].controls; let i=index">
            <input type="checkbox" formControlName="item.value.Selected" [value]="item.value.RULE_LOOKUP_ID">{{item.value.DESCRIPTION}}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

如果我在输入控件中不使用FormControlName，则该窗体将显示所有复选框，并且未选中。但是，如果我尝试使用FormControlName，则会出现以下错误：

错误错误：找不到路径为“ allRulesArray-> item.value.Selected”的控件

我又如何根据从另一个API调用获得的INT列表设置要检查的值？现在，我正试图强迫它检查所有内容，以使某些功能正常工作。

设置复选框值反应形式

0 个答案: