Javascript 如何修复表单错误'；验证'；在角度上未定义的

HTML

如何修复错误：

错误类型错误：无法读取未定义的属性“validate”

我想要的是用户名有一个验证，

已经存在

，并且

用户名是必需的

我添加了用户名AsyncValidator，在我添加用户名之后，它开始导致一个错误，即

错误类型错误：无法读取未定义的属性“validate”

。但是，当我尝试删除用户名中的UsernameAncyValidator时，它没有任何错误

如何修复它

错误：

    at normalizeAsyncValidator (forms.js:930)
    at Array.map (<anonymous>)
    at composeAsyncValidators (forms.js:2150)
    at coerceToAsyncValidator (forms.js:2501)
    at new FormControl (forms.js:3236)
    at FormBuilder.push../node_modules/@angular/forms/fesm5/forms.js.FormBuilder.control (forms.js:6462)
    at FormBuilder.push../node_modules/@angular/forms/fesm5/forms.js.FormBuilder._createControl (forms.js:6502)
    at forms.js:6488
    at Array.forEach (<anonymous>)
    at FormBuilder.push../node_modules/@angular/forms/fesm5/forms.js.FormBuilder._reduceControls (forms.js:6487)```

在normalizeAsyncValidator（forms.js:930）
在Array.map（）处
在composeAsyncValidators上（forms.js:2150）
在强制异步验证程序（forms.js:2501）
在新的FormControl中（forms.js:3236）
在FormBuilder.push../node_modules/@angular/forms/fesm5/forms.js.FormBuilder.control（forms.js:6462）
在FormBuilder.push../node_modules/@angular/forms/fesm5/forms.js.FormBuilder._createControl（forms.js:6502）
网址：forms.js:6488
在Array.forEach（）处
在FormBuilder.push../node\u modules/@angular/forms/fesm5/forms.js.FormBuilder.\u reduceControl（forms.js:6487）```

由于this.UsernameAncyValidator是异步验证程序，请将UsernameAncyValidator添加为username控件的第三个参数。另一个变化是将表单创建移动到ngOnInit或constructo中，如下所示：

试试这个：

 constructor(private fb: FormBuilder) {
    this.validateForm = this.createFormGroup();
  }

 createFormGroup(data?: Partial<User>) {
        const dataObj = {
          id: [data && data.id],
          username: [
            {
              value: (data && data.username) || '',
              disabled: data instanceof User
            },
            [Validators.required],
            [this.userNameAsyncValidator]
          ]
        }

        return this.fb.group(dataObj);
    }

构造函数（私有fb:FormBuilder）{
this.validateForm=this.createFormGroup（）；
}
createFormGroup（数据？：部分）{
常数dataObj={
id:[数据和数据.id]，
用户名：[
{
值：（data&&data.username）| |“”，
已禁用：用户的数据实例
},
[Validators.required]，
[此.usernameAncyValidator]
]
}
返回此.fb.group（dataObj）；
}

由于this.UsernameAncyValidator是异步验证程序，请将UsernameAncyValidator添加为username控件的第三个参数。另一个变化是将表单创建移动到ngOnInit或constructo中，如下所示：

试试这个：

 constructor(private fb: FormBuilder) {
    this.validateForm = this.createFormGroup();
  }

 createFormGroup(data?: Partial<User>) {
        const dataObj = {
          id: [data && data.id],
          username: [
            {
              value: (data && data.username) || '',
              disabled: data instanceof User
            },
            [Validators.required],
            [this.userNameAsyncValidator]
          ]
        }

        return this.fb.group(dataObj);
    }

构造函数（私有fb:FormBuilder）{
this.validateForm=this.createFormGroup（）；
}
createFormGroup（数据？：部分）{
常数dataObj={
id:[数据和数据.id]，
用户名：[
{
值：（data&&data.username）| |“”，
已禁用：用户的数据实例
},
[Validators.required]，
[此.usernameAncyValidator]
]
}
返回此.fb.group（dataObj）；
}

在我的情况下，升级到Angular 11时。以下验证程序阵列正在破坏单元测试：

[, Validators.required]

---

请注意，逗号前没有任何内容。删除逗号为我解决了这个问题。

在我升级到Angular 11时。以下验证程序阵列正在破坏单元测试：

[, Validators.required]

---

请注意，逗号前没有任何内容。删除逗号为我解决了这个问题。

在我的情况下，我必须从导入到工作中删除FormsModule和ReactiveFormModule

在我的情况下，我必须从导入到工作中删除FormsModule和ReactiveFormModule

你能在TS文件中显示导入吗@萨基拉完成了，先生。我还添加了导入。user.moduleDoes this.usernameAncyValidator验证程序是否被触发？@Chellappanவ 当我尝试运行时，这是错误类型错误：无法读取未定义的属性“validate”是否可以从validators数组中删除此.UsernameAncyValidator并进行检查？能否在TS文件中显示导入@萨基拉完成了，先生。我还添加了导入。user.moduleDoes this.usernameAncyValidator验证程序是否被触发？@Chellappanவ 当我尝试运行时，这是错误类型错误：无法读取未定义的属性“validate”是否可以从validators数组中删除此。UserName AsyncValidator并检查？您正在将form builder注入构造函数中，并尝试在创建form builder之前访问它，如果您将表单创建移到de ngOnInit或Contractor中，则不会抛出任何错误我只是在构造函数上注释代码。我的构造函数内部是空的。你修好了吗？你正在构造函数中注入form builder，并试图在创建form builder之前访问它。如果你将表单创建移到ngOnInit或Contractor中，它不会抛出任何错误。我只是在构造函数上注释代码。我的构造函数内部是空的。你修好了吗？

[, Validators.required]