Angular中如何为表单数组内的控件设置必填验证？

先修正你代码里的一个小问题：skills数组的map回调里没有返回创建的控件，导致数组实际是空的。然后给每个控件加上Validators.required就能实现必填验证，具体修改如下：

1. 导入Validators #

在组件文件顶部导入Angular表单的验证器：

import { Validators } from '@angular/forms';

2. 修改表单初始化代码 #

调整skills数组的控件创建逻辑，添加必填验证，并补全return：

this.feedbackForm = this.fb.group({
  applicantId: [''],
  comments: [''],
  recommendation: [''],
  skills: this.fb.array(
    this.skills.map((t) => {
      // 为每个控件设置初始值和必填验证
      return this.fb.control(t, Validators.required);
    })
  ),
});

也可以简化map的写法，去掉大括号自动返回：

this.feedbackForm = this.fb.group({
  applicantId: [''],
  comments: [''],
  recommendation: [''],
  skills: this.fb.array(
    this.skills.map(t => this.fb.control(t, Validators.required))
  ),
});

这样skills数组里的每个表单控件就都带上了必填验证，提交表单时会检查每个skill输入框是否为空。

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