无法分配给引用或变量！ （与链接不同的情况）

Question

尽管问题的措辞相似，但这个问题不能通过this one 之类的答案解决。

我正在使用自定义组件，并按预期进行以下工作。没有错误，没有警告。

<app-setter [(setting)]="records[0]"></app-setter>
<app-setter [(setting)]="records[1]"></app-setter>
<app-setter [(setting)]="records[2]"></app-setter>

当然，我更喜欢使用这样的模板生成器。

<app-setter *ngFor="let record of records;"
            [(setting)]="record"></app-setter>

这会产生以下错误。

无法分配给引用或变量！

谷歌搜索会导致很多关于同一主题的点击 - 组件中的变量与生成的标签的 ID 之间存在冲突。据我所知，这里不是这种情况。我将组件中的唯一字段重命名为 records，我什至没有看到任何 ID 分配给生成的标签。

问题的原因可能是什么？如何进一步诊断？我不确定如何学习实际发生的地方（它是 compiler.js:xxxx，它告诉我什么都没有）。

编辑

我尝试了以下但没有成功。

<ng-container *ngFor="let record of records;">
  <app-setter [(setting)]="record"></app-setter>
</ng-container>

但是，我注意到从香蕉盒中取出香蕉会使错误消失（当然结果是双向绑定被破坏。这有效：

<ng-container *ngFor="let record of records;">
  <app-setter [setting]="record"></app-setter>
</ng-container>

它告诉我的很少。但它说明了什么，对吧？

组件代码如下所示。

export class AssessmentComponent implements OnInit {
  constructor() { }
  records: Record[];
  ngOnInit() { this.records = [new Record("x", 3), new Record("y", 2)]; }
  onAddition(event: Record) { console.log(); }
}

Answer 1

您需要像这样使用 *ngFor 循环设置索引。

 <app-setter *ngFor="let record of records; let i = index"
                [(setting)]="records[i]">
 </app-setter>

就像我在其他解决方案的评论中提到的那样，Nikhil 关于使用 ng-container 的建议是一种很好的做法。虽然您不在这里执行此操作，但如果您需要在同一元素上使用 *ngIf 和 *ngFor，请使用另一个答案中描述的 ng-container，它会产生所需的效果。

Answer 2

编辑： 感谢 @thenolin 解决这个问题。但是从OP提供的内容来看，我认为我们应该使用records[i]而不是record[i]。

<app-setter *ngFor="let record of records; let i = index" [(setting)]="records[i]">
</app-setter>

另外，不需要使用<ng-container>。

原答案：

<ng-container *ngFor="let record of records;">
   <app-setter [(setting)]="record"></app-setter>
</ng-container>

ng-container 是一个不影响样式或布局的分组元素。

您可以用<div> 或任何其他元素替换上面sn-p 中的<ng-container>，但这可能会影响您的布局。