Is it possible to make Angular ReactiveForm ValidatorFn which set error for a few seconds?

Question

I'm trying to write ValidatorFn to check does the form's control have duplicates.

I have written a validator to check it and return an error, but is it possible to remove this error after a few seconds by this validator? I know how to make it from a component, but I want to write it once and reuse for all controls with this validator

export function tagDuplicates(): ValidatorFn {
  return (control: AbstractControl): ValidationErrors | null => {
    if (!(control.dirty || control.touched) || !control.value) {
      return null;
    } else {
      const values = [...control.value].map(reduceString);

      if (values.some((el: string, index: number) => values.indexOf(el) !== index)) {
        control.value.pop();

        return { duplicate: `Item already added` };
      }

      return null;
    }
  };
}

function reduceString(str: string): string {
  return str.toLocaleLowerCase().replace(/[ ,.]/g, '');
}

Answer 1

you has the control, so you can using a timer of Rxjs use setErrors(null)

import {timer} from 'rxjs'
...
if (values.some((el: string, index: number) => values.indexOf(el) !== index)) {

    timer(5000).subscribe(res=>{
        control.setErrors(null)
     })
     return { duplicate: `Item already added` };
 }

You can see a example in stackblitz