Question

我正在尝试验证* ngFor循环中所需的输入。但是我无法获得唯一的模板参考。在“提交”中，所有输入字段均为必填字段，或者如果至少填写了一个字段则为空。

我试图声明模板引用，例如#optionContent _ {{i}}，但我可以在[ngClass]中填充它。

有帮助吗？

<form name="form" (ngSubmit)="f.form.valid && addOption()" #f="ngForm" novalidate>
 <div class="row" *ngFor="let size of optionModel.optionContent let i = index">
   <div class="col-12">
     <label for="optionContent_{{i}}>Name Option</label>
        <input id="optionContent_{{i}}"
               type="text"
               #optionContent="ngModel"
               [ngClass]="{ 'is-invalid': f.submitted && optionContent.invalid }"
               required
               name="optionContent"
               [(ngModel)]="size.name"  class="form-control">
   </div>
  </div>
</form>

Answer 1

问题在于它们的名称属性都具有相同的名称，因此ngForm会感到困惑，请尝试添加动态名称

<input ... name="optionContent{{i}}" ../>

输入验证模板参考ngFor

1 个答案: