在9号角项目中，我有一个数字列表。该长度不是固定的，可以在运行时更改。数字应绑定到matInput-fields的值。当然，输入字段的数量应等于列表的长度。
我是这样做的：
ts文件：
public values: number[] = [];
ngOnInit() {
for (let i = 0; i < 10; i++) {
this.values.push(3);
}
}
html-template：
<span *ngFor="let value of values; index as i">
<mat-form-field>
<mat-label>Value {{i}}:</mat-label>
<input matInput [(ngModel)]="values[i]">
</mat-form-field>
</span>
问题是，当您在输入中输入值时，该值也会在下一个输入中更改。文本光标也跳到下一个输入字段。
可以在以下位置找到此问题的演示：https : //codesandbox.io/s/elastic-swirles-5yzzj
我也尝试过用[value]而不是[(ngModel)]结果是一样的。
你能告诉我我的错误在哪里吗？
演示首先，不要尝试使用yo字符串或int数组进行绑定。您应该为此使用对象数组
public values = [];
ngOnInit() {
for (let i = 0; i < 10; i++) {
this.values.push({ value: 3 });
}
}
在HTML
<input
matInput
type="number"
[(ngModel)]="value.value"
style="border: 1px solid gray;"
/>
如果您想要int数组作为结果，则使用映射
printValues(): void {
console.log(this.values.map(x => x.value));
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句