添加到Reactive Forms Array Angular的开头 [英] Add to the beginning of Reactive Forms Array Angular

问题描述

请参阅相关的拨弄器

https://plnkr.co/edit/f0BxpinhuqVz8o6IIFaL?p=preview

stack overflow makes you put code if a plunker is linked
but it is too much code to copy paste here it would just
look messy so I a am putting this comment instead.

如果运行此命令，然后单击添加"按钮，则会将新条目添加到数组，但是表单视图不会反映表单状态，而是复制第一个条目，最后一个条目消失.

If you run this and then click the add button a new entry is added to the array, but the form view does not reflect the forms state, instead the first entry is duplicated and the last entry is gone.

如果有人对我做错了什么有什么想法或指南，我将不胜感激，因为我被困在一个看似简单的任务上.

If anyone has any ideas or guides as to what I am doing wrong I would be very grateful as I have been pretty stuck on a seemingly easy task.

我试图尽可能遵循官方的Angular Reactive Forms指南来构建此示例.

I tried to follow the official Angular Reactive Forms guide as close as possible to build this example.

推荐答案

似乎Angular无法在formArray中跟踪对象的索引.这可以通过使用trackBy解决.使用以下功能将其添加到您的迭代中:

Seems like Angular has trouble tracking the index of your objects in your formArray. This can be solved by using trackBy. Add it to your iteration with function:

<div *ngFor="let detail of detailArray.controls; let i=index; trackBy:trackByFn" [formGroupName]="i">

和组件中的

trackByFn(index: any, item: any) {
  return index;
} 

您的 PLUNKER

Your PLUNKER

这篇关于添加到Reactive Forms Array Angular的开头的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！