Angular-输入的动态ngModel

Question

如何为表单元素(即输入、选择(创建动态模型？

我有这个：

<input type="text" [name]="input.name" [(ngModel)]="input.name" [title]="input.title" /> 

其中模型可以是动态生成的任何东西(即地址、first_name(？

export class SampleComponent implements OnInit {
inputs!:any[];
constructor() { }
ngOnInit(): void {
console.log(this.inputs);
}
}

我寻找了相关的问题，这是最接近的问题，在ngFor内部的ngModel中设置动态属性，使用Angular 2，但我似乎能做到。有其他方法可以做到这一点吗？

角度版本：(12.0.2(

提前感谢！enter code here

Answer 1

您最好使用反应式表单而不是模板驱动表单来完成这项任务，因为它在动态验证器和多个工作示例(包括官方文档中的这一个(方面为您提供了更大的灵活性和易用性。

由于你的模型是any类型的，这基本上回答了你的问题——在我看来，不需要重复官方文档(尽管如果你在谷歌上搜索"角度动态形式"，还有很多其他有效的例子(

Answer 2

#I guess you might look at this
https://angular.io/guide/forms#bind-input-controls-to-data-properties
#import FormsModule
#create a template driven form
<form #myForm="ngForm">
<input type="text" class="form-control" id="name"
required
[(ngModel)]="input.name" name="input.name"
[title]="input.title"
#name="ngModel">
<!-- for example -->
<select class="form-control" id="cities"
required
[(ngModel)]="model.city" name="cities"
#cities="ngModel">
<option *ngFor="let data of data" [value]="data">{{data}}</option>
</select>
</form>
# here #cities, #name is just template ref variable can be used or avoided in case you don't need to track control of model