Question

这是从https://angular.io/guide/form-validation#custom-validators

中提取的一段代码

/** A hero's name can't match the given regular expression */
export function forbiddenNameValidator(nameRe: RegExp): ValidatorFn {
   return (control: AbstractControl): {[key: string]: any} => {
       const forbidden = nameRe.test(control.value);
       return forbidden ? {'forbiddenName': {value: control.value}} : null;
  };
}

第三行发生了什么：

 return (control: AbstractControl): () => {}

是否输入lambda函数将返回的内容？ forbiddenNameValidator应该返回ValidatorFn，ValidatorFn应该被理解为ValidatorFonction吗？

Answer 1

如果你研究ValidatorFn接口的定义，它有以下模式 -

interface ValidatorFn {
  (c: AbstractControl): ValidationErrors | null
}

这意味着您可以返回任何接受AbstractControl类型参数的函数，并返回类型ValidationErrors（实际上是类型别名）或null。

以下是ValidationErrors的定义，它具有以下索引签名

type ValidationErrors = {
    [key: string]: any;
};

所以你的下面的例子

return (control: AbstractControl): {[key: string]: any} => { 
 // other code 
 return forbidden ? {'forbiddenName': {value: control.value}} : null; // check this line it's corresponds to ValidationErrors | null
}

实际上返回一个与ValidatorFn接口模式兼容的相同签名函数。

(control: AbstractControl): {[key: string]: any} => 
       {
         return forbidden ? {'forbiddenName': {value: control.value}} : null; 
       }

点击此链接以供参考：https://angular.io/api/forms/ValidatorFn#call

因此forbiddenNameValidator函数背后的想法是返回一个与ValidatorFn接口的属性具有相同签名的函数

（控制：AbstractControl）：

1 个答案: