Angular7 FormArray复选框未绑定到模型

时间:2019-09-02 23:56:54

标签: typescript angular7 formarray

我正在尝试创建一系列绑定到json数据的复选框。

我所显示的内容有效,但是如果我取消选中其中一个框,则该模型尚未更新。

我已经阅读了几篇SO文章,但似乎找不到正确的语法。

感谢您的帮助

<form [formGroup]="fgCashFlows">

  <br />
  <div formArrayName="faCashFlows"  
       *ngFor="let cf of myCashFlows; let i=index">


    <input [id]="cf.cashFlowName" type="checkbox"
          [formControlName]="i"
           value="cf.display"
           (change)="lessData()"/>{{cf.cashFlowName}}

    {{i + 1}} {{cf.cashFlowName}}
    <br />

  </div>

</form>

cashflow.component.ts的片段

  constructor(private fb: FormBuilder) {

      this.fgCashFlows = this.fb.group({
        faCashFlows: this.fb.array([])
      });

    this.myCashFlows = Array.from(CASHFLOWS) ;
    this.bc2Data = Array.from(CASHFLOWS) ;
      this.addCheckBoxes();
 }
 addCheckBoxes() {
    this.myCashFlows.map((o, i) => {
      const control = new FormControl(true);  
      (this.fgCashFlows.controls.faCashFlows as FormArray).push(control);
    });
  }

  lessData(): void {


    this.clearGraph();
    this.drawBC2();
  }

数据看起来像这样... cashFlow.display是我要绑定的内容。 这只是摘录,想证明我不是要绑定到字符串“ true”。

如果我将true更改为false,则复选框将显示为已清除。我有那么多工作。

 {
    "cashFlowName": "Revenue",
    "display" : true,
      "values": [
      {
        "periodName": "Jan",
        "value": 90
      }
...
}

0 个答案:

没有答案