폼엘리먼트의 커스텀 유효성검사를 위해 디렉티브를 만들어 사용할 수 있다.
forbiddenName과 같은 동기식 유효성검사를 위한 디렉티브에서도 재사용가능한 함수를 만들어 사용했다.
비동기유효성검사를 위한 디렉티브를 만들고 재사용가능한 서비스를 만드는 것도 가능하다.
함수는 디렉티브에서 호출하면 되지만 서비스는 의존성주입을 해야하고 서비스에서 validate함수가 실행되고 값을 반환해야 한다.
@Injectable({
providedIn:'root'
})
export class UniqueAlterEgoValidator implements Validator{
validate(control: AbstractControl<any, any>): ValidationErrors | null {
}
}
validate함수를 구현하여 ValidationErrors | nul을 반환하는 서비스를 만든다.
@Directive({
selector: '[appAlterEgo]',
providers:[{provide:NG_ASYNC_VALIDATORS,useExisting:forwardRef(()=>UniqueAlterEgoValidator),multi:true}]
})
export class AlterEgoDirective {
constructor(private uniqueAlterEgoValidator:UniqueAlterEgoValidator) { }
validate(control:AbstractControl){
this.uniqueAlterEgoValidator.validate(control);
}
}
디렉티브는 데코레이터에 forwardRef(()=>UniqueAlterEgoValidator)으로 실제 유효성검사를 수행되는 서비스를 설정해야 한다.
의존성주입된 서비스의 validator함수를 호출할뿐이다.
디렉티브는 유효성검사를 서비스에 위임하는 것이다.