Angular2获取formcontrol的现有验证器

Question

让我们说

surname = new FormControl('', [Validators.required, Validators.minLength(2)]);

在某些时候，根据情况，我可以添加或删除姓氏控制上的任何验证器。

最后我怎么知道姓氏控制中存在哪些验证器？我在文档中找不到任何东西，也没有将控件转储到控制台中

就像是

surname.getValidators() should return - ['required', 'minLength']

Answer 1

目前不支持从控件读取验证器

另见https://github.com/angular/angular/issues/13461

Answer 2

您可以显示如下错误消息：

onValueChanged(data?: any) {
    if (!this.heroForm) { return; }
    const form = this.heroForm;
    for (const field in this.formErrors) {
            // clear previous error message (if any)
            this.formErrors[field] = '';
            const control = form.get(field);
            if (control && control.dirty && !control.valid) {
            const messages = this.validationMessages[field];
            for (const key in control.errors) {
                this.formErrors[field] += messages[key] + ' ';
            }
        }
    }
}
formErrors = {
    'name': '',
    'power': ''
};
validationMessages = {
    'name': {
        'required':      'Name is required.',
        'minlength':     'Name must be at least 4 characters long.',
        'maxlength':     'Name cannot be more than 24 characters long.',
        'forbiddenName': 'Someone named "Bob" cannot be a hero.'
    },
    'power': {
        'required': 'Power is required.'
    }
};

参考：https://angular.io/docs/ts/latest/cookbook/form-validation.html#!#reactive-component-template

Answer 3

如果要检查表单控件是否包含某个验证器，可以执行以下操作：

对于角度内置验证器，您可以使用：

if(control.validator == Validators.required)

对于自定义验证器，它将无法使用，您可以使用此解决方法：

if(control.validator.toString() == customValidator().toString())

Answer 4

Günter Zöchbauer's answer在Angular 6中仍然是正确的，但有一个适合我的解决方法。

我的解决方法取决于两个观察结果：

首先，您可以通过查看errors对象上的键来查看当前失败的验证。因此，如果指定了Validators.required和Validators.minLength，则errors对象将如下所示：

{ required: true, minlenght: { ... } }

这对于很多用例来说已经足够好了，当你真的不关心验证器是否存在但是没有阻止表单提交时。

其次，结果是Angular将创建验证器以匹配输入上设置的属性。因此对于标准验证器，我的建议是根本不指定验证器。

做这样的事情：

<input type="text" formControlName="surname" [required]="surnameRequired">

在您的表格声明中：

form = this.formBuilder.group({
  surname: '',
  anotherField: ['', Validators.required],
  yetAnotherField: ['', Validators.required]
});

然后设置surnameRequired的值以添加或删除验证器。

我有一个working StackBlitz。

我的方法不适用于自定义验证器，但我的大部分用例都没有使用它们。你的旅费可能会改变。