Angular 在虚拟滚动中失去了 FormControl 中的绑定答案

【问题标题】：Angular loses binding in FormControl inside a virtual scrollAngular 在虚拟滚动中失去了 FormControl 中的绑定
【发布时间】：2021-08-02 13:17:01
【问题描述】：

我正在使用带有大量输入字段的 Virtual Scroll 组件，但在我滚动了一下之后，我的绑定被破坏了。值被写入不正确的元素。

<form [formGroup]="animalForm" >
 
  <div *cdkVirtualFor="let animal of animalArray; >

    <input [id]="animal.Id"  cdkFocusInitial matInput type="text"  [formControlName]="animal.Id" />

  </cdk-virtual-scroll-viewport>
</form>

一切正常，但滚动后 ValueChange 侦听器获取不正确 Id 的值（不正确的动物）

【问题讨论】：

您的代码错误。如果你使用formControlName，你应该remove [value]
感谢提示，但行为保持不变

标签： angular forms data-binding scroll

【解决方案1】：

我只是为了做一个堆栈闪电战，你是对的，使用 formControlName 绑定是错误的:(....但你可以尝试使用 formControl :)

<input [id]="animal.Id"  cdkFocusInitial matInput type="text"  
    [formControl]="form.get(animal.Id)" />

看到这个fool stackblitz-在stackblitz中我不使用matInput，这就是我不确定100%是否有效的原因-

【讨论】：

不知道为什么他们的其他方法会失去绑定