Angular响应式表单数组：调用RemoveAt(i)前如何设置值？

要在调用removeAt前为目标表单控件设置IsDeleted: true，核心是先获取对应表单组并修改值，再执行移除操作，避免移除后控件不存在无法修改。以下是修正后的实现代码：

removeCustomerPhone(custIndex: number, phoneIndex: number) {
  // 1. 获取要操作的电话号码表单组
  const targetPhoneForm = this.customerPhones(custIndex).at(phoneIndex) as FormGroup;
  
  // 2. 仅修改IsDeleted字段，用patchValue比setValue更灵活（无需传入所有字段）
  targetPhoneForm.patchValue({
    IsDeleted: true
  });
  
  // 此时你的valueChanges订阅会自动触发，将stateEnum设为Modified（因为patchValue默认emitEvent为true）
  
  // 3. 执行移除操作，保持原有的emitEvent配置
  this.customerPhones(custIndex).removeAt(phoneIndex, {
    emitEvent: false
  });
}

关键说明： #

• 操作顺序：必须先修改表单值再移除控件，否则移除后目标表单组已从数组中删除，无法再修改其值
• patchValue vs setValue：使用patchValue仅更新需要修改的字段，避免因setValue要求传入所有字段而导致的表单状态异常
• valueChanges触发：patchValue默认会触发valueChanges订阅，所以你之前设置的stateEnum = State.Modified逻辑会自动执行，无需额外处理

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