定制异步验证在返回承诺时不起作用

Question

我正在调用web api来检查urlalias是否可用，对于此任务，我在我的异步验证程序中使用了httpservice。 问题是，当调用验证程序时，将执行所有正确的代码路径（所有console.log()运行并按预期行为）。

无论验证中的承诺是否返回/解析为空或一个{ 'isUrlAliasActivityMainAvailable': true }，控制器总是显示一个错误对象，因此保持表单状态为无效，为什么（血腥地狱！）？

我使用的是：角：2.1.0和rxjs：5.0.0-beta.12

这是我formbuilder：

this.formBuilder.group({ 
//... 
"urlAliasActivityMain":[null,[ ValidatorsZr.isUrlAliasActivityMainAvailableAsyncValidator(this.httpActivityService)]], 
}); 

这是我的验证：

public static isUrlAliasActivityMainAvailableAsyncValidator(httpActivityService: HttpActivityService) { 
     return function (control: FormControl): Promise<any> | Observable<any> { 

      const promise = new Promise<any>(
       (resolve, reject) => { 
        httpActivityService.isUrlAliasActivityMainAvailable(control.value) 
         .subscribe(
         (data: any) => { 
          console.log("isUrlAliasActivityMainAvailableAsyncValidator"); 
          console.log(data); 
          if (data == false) { 
           console.log("data == false"); 
           resolve({ 'isUrlAliasActivityMainAvailable': true }); 
          } 
          else { 
           console.log("data == true"); 
           resolve(null); 
          } 
         }, 

        ) 
       }); 

      return promise; 
     } 
    } 

Answer 1

您的异步验证器列在同步验证器中的位置数组并且正在被错误地评估。

[objectValue, synchronous validators, asynchronous validators]

控制（formState：对象，验证器?: ValidatorFn | ValidatorFn []， asyncValidator ?: AsyncValidatorFn | AsyncValidatorFn []）：FormControl 构造一个新的FormControl与给定formState，验证器，和 asyncValidator。

formState既可以是用于窗体控件的独立值，也可以是包含值和禁用状态的对象 。

要纠正它，移动你的验证到合适的阵列位置：

this.formBuilder.group({ 
//... 
"urlAliasActivityMain":[null, null, ValidatorsZr.isUrlAliasActivityMainAvailableAsyncValidator(this.httpActivityService)], 
});