基于 ngFor 的 Angular 4 FormControl答案

【问题标题】：Angular 4 FormControl based on ngFor基于 ngFor 的 Angular 4 FormControl
【发布时间】：2018-06-13 22:08:58
【问题描述】：

我有一个自动完成下拉菜单，我选择的任何内容都应该添加到一个数组中，并在另一个下方呈现。我在 select 上推送选定的对象并使用 ngFor 我正在渲染值加上一个输入字段来指定数量。

问题是一旦我选择了一个项目并呈现它，我在文本框中输入了一些值，当我再次从自动完成中选择另一个产品时，第一个值重置为 0。我假设名称控件是相同的这是造成问题的原因。但是如何创建新控件，因为我在加载期间创建了 formbuilder 组。附上图片以获得更清晰的想法。

【问题讨论】：

【解决方案1】：

这个问题来自于 Angular 如何处理 HTML 中的循环。

为避免出现这种行为，您需要从这里更改您的代码

<ng-container *ngFor="let x of y">
  <span>{{x}}</span>
</ng-container>

到这里

<ng-container *ngFor="let x of y; let i = index; trackBy:x.__ID"> // Use an unique identifier in place of __ID
  <span>{{x}}</span>
</ng-container>

【讨论】：