问题

我有一个formArray，我想检查每个单独的formGroup，以查看特定的组是否有效或无效（这样我就可以在有效的组上调用特定的函数，而在无效的组上不调用）。

当我执行<div>Form Group Valid?: {{roundInputs.get('{{roundCount}}')?.valid}}</div>时，它不会返回false或true（其中roundCount是ngFor中的索引）。然而，如果我执行<div>Form Group Valid?: {{roundInputs.get('0')?.valid}}</div>，其中0是索引，它会返回true/false（或用任何索引替换0，效果都相同）。

我认为问题可能是索引是一个数字，而roundInputs.get()正在寻找一个字符串，插值使用了一个数字？如果是这样的话，我的下一个想法是也许我需要创建一个自定义管道，它接受一个数字并将其转换为字符串？

如果有人有任何想法或比自定义管道更好的建议，将不胜感激。我有点惊讶Angular没有一个可以将数字转换为字符串的管道。

答案1

得分: 0

因为在

<div>表单组有效？：{{roundInputs.get('{{roundCount}}')?.valid}}</div>

你将 '{{roundCount}}' 作为一个字面字符串发送，所以 get 方法找不到索引。

作为一种解决方法，你可以使用

<div>表单组有效？：{{roundInputs.get(`${roundCount}`)?.valid}}</div>

或者

<div>表单组有效？：{{roundInputs.get(roundCount + '')?.valid}}</div>

<div>Form Group Valid?: {{roundInputs.get('{{roundCount}}')?.valid}}</div>

<div>Form Group Valid?: {{roundInputs.get(`${roundCount}`)?.valid}}</div>

<div>Form Group Valid?: {{roundInputs.get(roundCount + '')?.valid}}</div>

答案2

得分: 0

当将 FormGroup 推入 FormArray 时，您需要将其设置为强制项。Angular 会自动检查并更新表单数组。但如果您想手动进行操作

1. 首先，通过 getter 获取 `roundInputs` 作为表单数组

```typescript
get getRoundInputs() {
    return this.roundInputs as FormArray;
}

2. 然后遍历数组

this.roundInputs.controls.forEach((control) => {
    //将控件转换为 FormGroup
});

这将提供类型安全的表单组。

<details>
<summary>英文:</summary>

When pushing FormGroup into FormArray, you need to make it mandatory. Angular checks and updates form array automatically. But if you want to do manually

1. First, get `roundInputs` as form array via getter

get getRoundInputs() {
return this.roundInputs as FormArray;
}

2. Then iterate over the array

this.roundInputs.controls.forEach((control) => {
//cast control as Form Group
});

This will give type safe form group. 

</details>