Angular在虚拟卷轴内的FormControl中丢失绑定

我正在使用一个虚拟滚动组件，其中有很多表单的输入字段，但是在我滚动了一点之后，我的绑定被破坏了。这些值被写入不正确的元素

<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>

我只是想做一个stackblitz，您是对的，使用formControlName:（……但是您可以尝试使用formControlName:）绑定是错误的



请看这一点-在stackblitz中，我不使用matInput，这就是我不确定100%是否有效的原因-
您的代码是错误的。如果您使用formControlName，您应该删除[value]，感谢您的提示，但是行为保持不变，不知道为什么其他方法会丢失绑定
<input [id]="animal.Id"  cdkFocusInitial matInput type="text"  
    [formControl]="form.get(animal.Id)" />