angular - 虚拟列表中的反应式表单行为不稳定

Question

我正在检查带有反应形式的虚拟滚动列表。场景是我有数千行显示在一个带有复选框的列表中以批准或反对。

所以在虚拟列表中我正在生成表单组[formGroupName]="i"。

但是，如果我选中一个复选框，则在滚动它时也会随机选择并选中其他复选框。

这真的很奇怪。

闪电战可以在这里看到 任何建议或提示都会有所帮助。谢谢

要重现此问题，您可以一直向下滚动到最后一项并将其标记为取消选中，然后滚动回顶部并再次向下滚动。您将看到不稳定的行为，它将再次标记为已检查。点击中间或顶部的任何一个，其他的也会被随机检查。

标签： angularvirtualscroll

Answer 1

所以对我来说可能有两个已知的修复方法。

1. 使用外部索引。在我的例子中，我在名为“index”的表单组内添加了一个新的表单控件，并将递增的值添加到每个表单组。然后我将其用作 [formGroupName]="item.controls.index.value" 并将其用作访问值的索引。

2. 其他解决方法是使用 [formGroup]="item" 而不是 [formGroupName]="i"。该解决方案在 Angular Material 存储库中提供。