Angular中如何访问FormArray内部的FormControl控件

你的代码失效有两个核心原因：

1. 顶层FormGroup中不存在名为personNameField的控件，你定义的嵌套控件路径为 form2 -> 数组索引 -> name
2. 嵌套在FormArray中的控件必须先指定数组索引，才能定位到对应子FormGroup下的目标控件

正确赋值写法 #

写法1：链式路径访问（推荐，写法简洁） #

// 路径按 控件名.数组索引.子控件名 拼接即可，此处访问form2数组第0项的name控件
(this.form.get('form2.0.name') as FormControl).setValue(this.person.name);

写法2：分步获取（逻辑清晰，适合复杂嵌套场景） #

// 先拿到FormArray实例
const form2Array = this.form.get('form2') as FormArray;
// 取数组第0项的FormGroup
const targetFormGroup = form2Array.at(0) as FormGroup;
// 给name控件赋值
targetFormGroup.get('name')?.setValue(this.person.name);

注意事项 #

• 如果你会动态增删FormArray的子项，赋值前先判断目标索引是否存在，避免数组越界报错：可先判断form2Array.length > 目标索引再执行赋值操作
• 如需批量给FormArray所有子项赋值，可直接调用form2Array.setValue(对象数组)，数组长度要和FormArray当前长度完全匹配；如果是部分赋值可以用patchValue方法
• 访问FormArray子项也可以用form2Array.controls[索引]写法，和at(索引)效果完全一致

内容的提问来源于stack exchange，提问作者natyus