预期验证者返回Promise或Observable

我正在尝试对Angular 5进行自定义验证，但遇到了以下错误

Expected validator to return Promise or Observable

我只想返回一个错误到表单，如果该值不符合要求，这是我的代码：

这是我的表格所在的组件

  constructor(fb: FormBuilder, private cadastroService:CadastroService) {
    this.signUp = fb.group({
      "name": ["", Validators.compose([Validators.required, Validators.minLength(2)])],
      "email": ["", Validators.compose([Validators.required, Validators.email])],
      "phone": ["", Validators.compose([Validators.required, Validators.minLength(5)])],
      "cpf": ["", Validators.required, ValidateCpf]
    })     
   }

这段代码在我要实现的验证文件中：

import { AbstractControl } from '@angular/forms';

export function ValidateCpf(control: AbstractControl){
    if (control.value == 13445) {
        return {errorCpf: true}
    }
    return null;
}

有人能帮我吗？这种类型的验证是否仅适用于可观察对象，或者我可以不做承诺或不可观察而做我？谢谢

这意味着您必须在数组中添加多个验证器

。例：

有错误

profileFormGroup = {
  budget: [null, Validators.required, Validators.min(1)]
};

上面的一个引发验证者返回Promise或Observable的错误

固定：

profileFormGroup = {
  budget: [null, [Validators.required, Validators.min(1)]]
};

说明：

在角反应式验证中，使用多个验证器时，可以使用内置验证器完成验证，该验证器可以在第二个位置以数组形式给出。

FIELD_KEY：[INITIAL_VALUE，[LIST_OF_VALIDATORS]]

以下应该工作：

  "cpf": ["", [Validators.required, ValidateCpf]]

表单控件期望的参数如下：

constructor(formState: any = null, 
            validatorOrOpts?: ValidatorFn | ValidatorFn[] | AbstractControlOptions | null,
            asyncValidator?: AsyncValidatorFn | AsyncValidatorFn[] | null)

来自https://angular.io/api/forms/FormControl

与OP的问题没有直接关系，但是在稍有不同的问题上却遇到了相同的错误。我有一个异步验证器，但忘了从中返回一个Observable（或Promise）。

这是我原来的异步验证器

public availableEmail(formControl: FormControl) {
   if(formControl && formControl.value){
     return this.http.get('')
   }
}

问题是，如果if语句为假，该怎么办？我们不返回任何内容，并且出现运行时错误。我添加了返回类型（如果不返回正确的类型，请确保IDE抱怨），然后of(true)在if语句失败的情况下返回。

这是更新的异步验证器。

public availableEmail(formControl: FormControl): Observable<any> {
   if(formControl && formControl.value){
     return this.http.get('someUrl');
   }
   return of(true);
}

Validators.compose（）是多余的；

您可以只传递一个数组。OP的问题是由于无法将验证器包装在[]中以使它们成为一个数组而引起的，因此，假定minLength（）是异步的，并导致了错误消息。

希望这个解决方案能对您有所帮助。谢谢。

错误：userName：[''，[Validators.required，Validators.minLength（3）]，forbiddenNameValidator（/ password /）]，

回答：userName：[''，[Validators.required，Validators.minLength（3），forbiddenNameValidator（/ password /）]]，

验证器仅在内部数组中使用第二个参数。不适合外部阵列

如果添加多个验证器，则需要添加另一个第三个括号“ []”，并在其中添加验证器。如下所示：

this.yourForm= this.formBuilder.group({
    amount: [null, [Validators.required, Validators.min(1)]],
});

错误： "cpf": ["", Validators.required, ValidateCpf]

固定： "cpf": ["", [Validators.required, ValidateCpf]]

我认为，除了接受错误的答案外，还应该澄清是否会发生错误，因为使用反应性表单创建FormControl时，在initial_value之后，以下参数分别是同步验证器和异步验证器，它们分别以数组的形式分组。例如：

myFormGroup = this.fb.group({
    myControl: ['', [ mySyncValidators ], [ myAsyncValidators ] ]
})

如果控件碰巧只有一个，则Angular会将其作为单个元素接受。例如：

myFormGroup = this.fb.group({
    myControl: ['', mySyncValidator, myAsyncValidator ]
})

因此，当忘记将它们分组的方括号时，Angular假定第二个验证程序项是异步验证程序的一部分，因此我们得到 Expected validator to return Promise or Observable