如何循环Angular FormArray - 当前设置为循环中的最后一项

Question

我正在尝试循环使用Form Array设置值。相当新的JavaScript。

下面的TeamWorkingDate设置为Team FormArray中每个7 FormGroup的相同日期，并设置为循环中的最后一个日期+ 7天。

我已经尝试过forEach的多种变体并回答@ JavaScript closure inside loops – simple practical example，因为我认为这必须是一些关闭问题。

尽管对此有所了解，但我对闭合的理解仍然有限。在这个例子中 - 是否setValue可以访问函数调用之外的变量i，因此'看到'i = 7？我以为let阻止了这个问题？

  setDates(date: moment) {
    var arr = [];
    for(let i = 0; i < 7; i++) {
      let nextDate = date.clone().add(i, 'day');
      arr.push(nextDate);
      (<FormArray>this.myForm.get('Teams')).controls[i]
        .get('TeamWorkingDate').setValue(arr[i]);
    }
  }

我的表格：

  ngOnInit() {
    this.myForm = this.fb.group({
      Teams: this.fb.array([])
    });
    const team = this.fb.group({
      TeamWorkingDate: '',
      ...
    })
    for (let i = 0; i < 7; i++) {
      (<FormArray>this.myForm.get('Teams')).push(team);
    }
  }

编辑：改为let nextDate = date.clone().add(i, 'day');而不是var

Answer 1

目前，formArray中的所有formGroup都指向相同的FormGroup引用，因此更改任何索引的值将有效地更新同一个组。在formArray中创建并推送新的FormGroup。

 ngOnInit() {
    this.myForm = this.fb.group({
      Teams: this.fb.array([])
    });
    for (let i = 0; i < 7; i++) {
      const team = this.fb.group({
      TeamWorkingDate: '',
        ...
      })
      (<FormArray>this.myForm.get('Teams')).push(team);
    }
  }