Angular 2- Error: Type 'AbstractControl' is not assignable to type 'AbstractControl'

Question

我正在使用 angular rc4 版本来编写一个应用程序，我必须在其中施加一些验证规则来形成 required、minlength 等组件以及一些自定义验证器 emailValidator.

当我将一个内置验证器和一个自定义验证器传递给 Validators.compose 函数时，IDE（Webstorm 和 VS Code）向我显示编译时错误消息，如下所示：

但是，您可以在上面的屏幕截图中看到，如果内置了两个验证器，则不会出现错误消息。

我的自定义验证器的定义如下：

static emailValidator(control: AbstractControl): {[key: string]: boolean} {
    if (control.value.match(/[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/)) {
      return null;
    } else {
      return {'invalidEmailAddress': true };
    }
}

Answer 1

这很奇怪，您已经尝试过 FormControl 了吗？

像这样？

static emailValidator(control : FormControl){
    // RFC 2822 compliant regex
    let EMAIL_REGEXP = /^[-a-z0-9~!$%^&*_=+}{\'?]+(\.[-a-z0-9~!$%^&*_=+}{\'?]+)*@([a-z0-9_][-a-z0-9_]*(\.[-a-z0-9_]+)*\.(aero|arpa|biz|com|coop|edu|gov|info|int|mil|museum|name|net|org|pro|travel|mobi|[a-z][a-z])|([0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}))(:[0-9]{1,5})?$/i;

    return EMAIL_REGEXP.test(control.value) ? null : {
      invalidEmailAddress:true
    }
}

我确实在我的组件中使用了 Validator.compose，它工作得很好。

Answer 2

我通过将 control 参数的类型从 AbstractControl 替换为 Control 解决了这个问题，如下所示：

static emailValidator(control: Control): {[key: string]: boolean} {
    if (control.value.match(/[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/)) {
      return null;
    } else {
      return {'invalidEmailAddress': true };
    }
}

Control class 从 AbstractControl 扩展而来。我仍然不明白为什么我在使用 FormControl 或 AbstractControl.

时收到此错误消息

Answer 3

我遇到了类似的问题。在我的例子中，我调用了我创建的共享 Angular 7 库中包含的自定义 EmailValidator class。因为

"@angular/forms": "~7.2.2"

在我的 package.json 文件中，为我的库和包含它的应用程序安装了两个不同的 @angular/forms 次要版本，导致不同的 TypeScript 定义文件。解决方案是

删除两个项目的 node_modules 文件夹
删除两个项目的包-lock.json
为两个项目执行 npm 安装
重新安装库

Angular 2- Error: Type 'AbstractControl' is not assignable to type 'AbstractControl'

Angular 2- Error: Type 'AbstractControl' is not assignable to type 'AbstractControl'

angular2-forms

angular