NgFor 中的 Angular 表单验证

Question

假设我有以下表格：

<form #form="ngForm">
    <div *ngFor="let action of member_plan.actions">
        <div class="container">
            <h4 class="text-sm-center black mb-3">{{findActionTitle(action)}}</h4>
            <div class="col-sm-12">
                <div class="form-group">
                    <div class="headline">Vælg tid (i dage)</div>
                    <input type="text" placeholder="Antal dage" class="form-control" [pattern]="numberPattern"
                           name="days-{{member_plan.actions.indexOf(action)}}" required
                           [(ngModel)]="action.time">
                    <li *ngIf="'days-'+member_plan.actions.indexOf(action).errors && ('days-'+member_plan.actions.indexOf(action).dirty || 'days-'+member_plan.actions.indexOf(action).touched)">
                        Tid kan ikke indeholde bogstaver
                    </li>

                </div>
            </div>
        </div>
        <hr/>
    </div>
</form>

正如您所见，我尝试添加验证，但是由于 name 必须是唯一的，我如何为每个单独的输入字段添加验证？

Answer 1

您可以使用 NG_VALUE_ACCESSOR 创建您自己的带有验证逻辑的输入组件。