Question

我不明白为什么这段代码总是只重复打印两次数组的第一个元素（“ AAA”，“ AAA”）我想念什么吗？也许我使用的数据绑定不好。

TS：

var x ="AAAA,BBBB";
this.items = x.split(',');

HTML：

<div   *ngFor="let item of items;let i = index">    
         <input [(ngModel)]="model.arrayListVariables [i]"  name="variable{{i}}" formControlName="variable" class="form-control" type="text">     
</div>

https://stackblitz.com/edit/angular-hzlzea

谢谢

Answer 1

从您的stackblitz代码中，我发现了以下问题。

两个输入都使用相同的formControlName，即variable。您需要为不同的输入使用不同的名称。

所以，我建议您进行如下更改：

app.component.html

...
<div *ngFor="let item of items;let i = index">
    <input [(ngModel)]="item"  name="variable{{i}}" [formControlName]="'variable'+i" type="text">
</div>
...

app.component.ts

...
this.form = this.formBuilder.group({                                 
                  variable0: [''],
                  variable1: ['']
      });
...

我也建议不要在形式上同时使用“模板驱动”和“反应式”方法。您可以在Introduction to forms in Angular中找到更多信息。

角数组数据绑定

1 个答案: