angular - 在 Angular 中创建动态 react 表单时无法将变量设置为 FormControl 名称

Question

我正在 Angular 中创建动态响应式表单。但是在下面的代码中，level.name 没有被接受，因为编译器不允许在 group() 中提供变量。它只允许固定值，如州、城市等，而不是 level.name 变量，其中 level 是一个具有名称字段的对象......

this.countryNextLevelsBeforeMan.forEach(**level** => {
  let l2 =<FormArray> this.l1FormGroup2.controls["l2"]; 
  l2.push(this.formBuilder.group({
    **level.name** : null   --> compilation error on this line as variable not getting allowed
  }))
});

在组方法中，我想将控件名称作为变量 (level.name)。在 for 循环中，如果级别是 {"name": "State", "id": 2} 那么我想像下面这样设置它，

l2.push(this.formBuilder.group({
        **State** : null    --> No compilation error if we give fixed value
     }))

(而不是“州”，我希望它由 level.name 动态分配，因为 level.name 可以是城市、街道等)

请帮忙!!!

Answer 1

试试这个:

this.countryNextLevelsBeforeMan.forEach(level => {
  let l2 =<FormArray> this.l1FormGroup2.controls["l2"]; 
  l2.push(this.formBuilder.group({
    [level.name]: null,
    [level.id]: []
  }))
});