Angular 5 FormGroup Validator 预期的验证器返回 Promise 或 Observable答案

【问题标题】：Angular 5 FormGroup Validator Expected validator to return Promise or ObservableAngular 5 FormGroup Validator 预期的验证器返回 Promise 或 Observable
【发布时间】：2019-02-23 23:01:01
【问题描述】：

我的 FormGroup 验证器引发“Promise or Observable”错误。我研究了许多 SO 示例，解释返回 Observable 或 Promise 作为错误状态，但没有一个解释为什么返回 null 在 Web 服务调用块中工作正常，但不是在验证器函数的末尾，如果它通过至底部。

验证器工作正常。只是我想在开始时消除错误。

组件.ts

    ngOnInit() {
    this.dnFormGroup = this.formBuilder.group({
    displayName: ['', [Validators.required], this.validateDisplayName.bind(this)] //NOTE: 2nd option is required! See https://angular.io/api/forms/FormGroup#description
    }); 
}

public validateDisplayName(control: AbstractControl) {
    if(control.value.length >= 3 && control.value !== this.authService.displayName) {
        this.displayName = control.value;

        return this.authService.validateDisplayName(control.value).then( 
           (res) => {
            if(res) {
              //displayName already used
              return { displayNameTaken: true };              
            } else {
              //displayName can be used
              return null;
            }
          },
          (err) => {
            return { displayNameTaken: true };                            
       });      
    }
    return null;  //<<<<< ERROR "Expected validator to return Promise or Observable"
}

谢谢，鲍勃

【问题讨论】：

标签： angular

【解决方案1】：

对验证器了解不多，但只有函数中第一个返回的类型很重要。

在 if 块中，您返回一个 Promise（返回 null 或一个对象，但它并不重要）所以没关系。

但是在块之外，你只需返回null，它既不是 Promise 也不是对象。尝试将其设为返回 null（带有 return Promise.resolve(null)）的 Promise 或返回 null（带有 import { of } from 'rxjs'; 和 return of(null)）的 Observable。

【讨论】：