Javascript 角度2：获取验证器限制

例如，我有这样的表格：

<form [formGroup]="form" (ngSubmit)="onSubmit()">

  <input type="text" formControlName="username">
  <div ngxErrors="username">
    <div ngxError="required" [when]="['dirty', 'touched']">
      Username is required
    </div>
  </div>

  <input type="text" formControlName="password">
  <div ngxErrors="password">
    <div ngxError="required" [when]="['dirty', 'touched']">
      Password is required
    </div>
    <div [ngxError]="['minlength', 'maxlength']" [when]="['dirty', 'touched']">
      5 characters minimum, 12 characters maximum
    </div>
  </div>

</form>

如何获取maxlength和minlength值？这样我就可以改变：

最少5个字符，最多12个字符

如下：

{form.get（'username'）.minlength}个字符最少，{{form.get（'username'）.maxlength}个字符最多

---

可能吗？

我没有解决办法。您可以从错误本身获取minlength或maxlength，但不能同时获取两者

要获取其中一个，可以使用如下语法：

最小长度应为{myError.getError（'minlength'）？.requiredLength}

但这并不完全是您想要的，因为在上述情况下，当minlength验证器向您提供错误时，您无法访问maxlength是什么。 起初，我认为从表单控件中查找验证器是一件简单的事情。但这显然是angular尚未支持的功能：

因此，我认为，目前唯一可能的解决方案是创建您自己的自定义验证器，该验证器将minlength和maxlength验证结合起来，并设置两者

我是这样做的。我在验证器服务中创建了一个自定义验证器，如下所示：

静态minAndMaxLengthValidator（选项）：Validator fn{
返回（控件：AbstractControl）：{
[键：字符串]：任何
} => {
如果(
control.value.length>options.maxLength||
control.value.length

export class AppComponent implements OnInit {

  form: FormGroup;

  constructor(
    private fb: FormBuilder
  ) {}

  ngOnInit() {
    this.form = this.fb.group({
      username: ['', [Validators.required]],
      password: ['', [Validators.required, Validators.minLength(5), Validators.maxLength(12)]]
    });
  }

}