Angular prevede già alcuni validator di base per le reactive form: required, min, max e così via. Questi validatori coprono le esigenze di base, ma non possono ovviamente coprirle tutte. Per coprire esigenze particolari della nostra applicazione, dobbiamo creare dei validatori custom.
Creare un validatore custom per le reactive form in Angular è tutt'altro che complicato. Si tratta di definire una funzione che a sua volta torna una funzione. Vediamo prima il codice.

export class CustomValidators {

  static stringNotEqual(value: string): ValidatorFn {
    return (control: AbstractControl): ValidationErrors | null => {
      if (isEmptyInputValue(control.value) || isEmptyInputValue(value)) {
        return null;
      }

      return value === control.value ? { 'notEqual': { 'value': value } } : null;
    };
  }
}

La funzione stringNotEqual verifica che il valore presente nel controllo della form sia diverso da un valore passato in input. La funzione accetta un parametro che rappresenta il valore che vogliamo confrontare con quello inserito dall'utente. Questa funzione torna un'altra funzione che prende in input il controllo di input. Questa seconda funzione esegue il controllo di validità e se non passa restituisce un oggetto che ha una proprietà che rappresenta il codice di errore (not-equal nel nostro caso) e eventuali valori che vogliamo restituire (possono essere utili per costruire il messaggio di errore). In caso il controllo di validità passi, allora torniamo null.