I implemented angular custom validator which works if I hardcode the main logic this way
import { Directive, forwardRef } from '@angular/core';
import { NG_VALIDATORS, FormControl } from '@angular/forms';
import { UserAdministrationService } from "./useradministration.service";
function validateUserNameFactory(userAdministrationService: UserAdministrationService) {
return (c: FormControl) => {
return {
validateUserName: {
valid: false
}
};
};
}
@Directive({
selector: '[validateUserName][ngModel],[validateUserName][formControl]',
providers: [
{ provide: NG_VALIDATORS, useExisting: forwardRef(() => UsernameValidator), multi: true }
]
})
export class UsernameValidator {
validator: Function;
constructor(private userAdministrationService: UserAdministrationService) {
this.validator = validateUserNameFactory(userAdministrationService);
}
validate(c: FormControl) {
return this.validator(c);
}
}
but now I would like to use server call inside and this one is not working
function validateUserNameFactory(userAdministrationService: UserAdministrationService) {
return (c: FormControl) => {
const q = new Promise((resolve, reject) => {
setTimeout(() => {
userAdministrationService.lookupUser(c.value).subscribe(() => {
resolve({
validateUserName: {
valid: false
}});
}, () => {
resolve({
validateUserName: {
valid: false
} });
});
}, 1000);
});
return q;
};
}
