在我使用反应式表单的Angular 7应用程序中,我正在基于 *ngFor
循环创建 input
元素,因此我最终得到一个动态命名的输入:
<nav class="level" *ngFor="let work of workLeft">
<input [formControlName]="work.abbrev">
这当然工作正常,但现在我正在尝试将验证错误消息添加到表单,但我不知道如何“解决”该项目 . 例如,div通常看起来像这样:
<div *ngIf="name.errors.required">
但我没有 name
,因为它是动态的 work.abbrev
值 . 处理这个问题的正确方法是什么?
你可以在这里看到我的尝试:https://stackblitz.com/edit/angular-8zevc1
1 回答
我建议使用
FormArray
. 使用FormArray
,以下是您的实现方式:对于组件类:
在模板中:
这是你的参考Sample StackBlitz .
PS: I 've made a few updates to the StackBlitz that you' ve共享包括Angular Style Guide推荐的内容以及实际解决方案 . 希望有所帮助 .