（控件：AbstractControl）：

Question

Here a snippet of code extract from 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;
  };
}

What is happening at the third line :

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

Is it typing what the lambda function will return ? forbiddenNameValidator is supposed to return a ValidatorFn, should ValidatorFn be understood as ValidatorFonction ?

Answer 1

If you study the definition of ValidatorFn interface it has the following pattern -

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

which mean you can return any function which accepts an argument of type AbstractControl and returns either type ValidationErrors (which is actually a type alias) or null .

Here is the definition of ValidationErrors , it has the below index signature

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

So your below example

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

actually returns a function of same signature that is compatible with the pattern of ValidatorFn interface.

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

check this link for reference : https://angular.io/api/forms/ValidatorFn#call

So the idea behind forbiddenNameValidator function is to return a function with same signature as the property of ValidatorFn interface