对动态创建的输入文本字段进行验证检查

Question

我通常通过向输入标签提供模板引用变量ngmodel来按角度检查输入文本字段的有效性，例如   tell application "Ableton Live Standard" make new document set today to (current date) set workbookName to ("my project " & month of today & " " & day of today") as string set destinationPath to (path to desktop as text) & workbookName save active workbook in destinationPath end tell ，然后将该变量用作#name1="ngModel" 检查其有效性并相应地显示错误消息。 但是，当我尝试使用动态生成的字段执行此操作时，例如，如果用户可以选择插入任意数量的电子邮件，以便他们可以选择再添加一个字段来添加另一封电子邮件，我可以使用{ {1}}但是我无法对其进行有效性检查，因为我无法为每个字段分配唯一的模板引用变量ngmodel。无论如何，是否需要对这些字段执行这些检查？我正在使用角度6。

Answer 1

  

对于验证，您可以在Angular中更好地选择“反应式表单验证”。

但是，如果您要坚持相同的解决方案，则可以在for loop中使用相同的参考名称，因为context的参考variable在loop内，并且每次迭代都会有所不同。

演示副本在这里https://stackblitz.com/edit/angular-forloop-same-reference

Answer 2

HTML文件中的

：

<form #f="ngForm"> <input [(ngModel)]="price" name="price" required/> <button class="btn" (click)="onClick(f)">btn</button> </form>

在ts文件中

`onClick（f：NgForm）{this.checkForm（f）; }

checkForm（form）{const control = form.controls; Object.keys（control）.forEach（controlName => control [controlName] .markAsTouched（））; Object.keys（control）.forEach（controlName => control [controlName] .markAsDirty（））; const data = []; Object.keys（control）.map（（key）=> {const newObj = {key，value：control [key]}; data.unshift（newObj）;}）;让title =''; for（让i = 0; i

我通过使用此输入名称和验证属性的动态验证来做到这一点