angular7表单的状态字段

touched 和 untouched

访问过和未访问过,获得焦点或者未获得焦点

<div>
      用户名:<input type="text" formControlName="username">
</div>
// 检验通过和第一次不显示
<div [hidden]="formModel.get('username').valid || formModel.get('username').untouched">
	  <div [hidden]="!formModel.hasError('required', 'username')">用户名是必填项</div>
	  <div [hidden]="!formModel.hasError('minlength', 'username')">用户名最小长度是6</div>
</div>

pristine 和 dirty

值改变和未改变

<div>
      手机号:<input type="number" formControlName="mobile">
  </div>
  // 只有手机号不合法并且修改过之后才显示
  <div [hidden]="formModel.get('mobile').valid || formModel.get('mobile').pristine ">
  <div [hidden]="!formModel.hasError('mobile', 'mobile')">手机号格式不正确</div>
</div>

pending

当一个字段处于异步校验时。

  <div [hidden]="formModel.get('mobile').pending ">
上一篇:javascript-Angular 7“预期’样式’为字符串数组”


下一篇:Angular7 HttpClient处理多个请求