Question

我想在用户触摸该特定字段时标记错误消息，然后单击外部而不输入任何内容。我不确定为什么下面的代码不起作用。
伙计们任何投入......我需要一些认真的建议。

<form [formGroup]="personalInfoForm" novalidate [ngClass]="{submitted: formSumitAttempt}"> 
     <div class="row">
     <div class="col-lg-6">
      <label for="firstName" class="userID control-label">First Name</label>

                <input type="text" class="form-control" id="firstName" placeholder="Name" formControlName="firstName"  [(ngModel)]="firstName"  required>
                <div *ngIf ="firstName?.touched && firstName?.errors" class="alert alert-danger">
                    <div [hidden]="!firstName.errors.required">
                        Name is required
                    </div>
                    </div></div></div>

Answer 1

您组件中的

personalInfoForm=new formGroup({
 firstname:new FormControl('',[Validators.required])
})

你的HTML

<form [formGroup]="personalInfoForm" novalidate [ngClass]="{submitted: formSumitAttempt}"> 
     <div class="row">
     <div class="col-lg-6">
      <label for="firstName" class="userID control-label">First Name</label>

<input type="text" class="form-control" id="firstName" placeholder="Name" formControlName="firstName"   required>
                <div *ngIf ="personalInfoForm.controls['firstname'].hasError('required')" class="alert alert-danger">
 Name is required </div>
</div></div>

使用formControl以角度输入字段验证

1 个答案: