/ / AsyncValidator empêche http si la valeur est nulle - angulaire, dactylographiée, angular2-formes, angular2-observables, validation-angulaire

AsyncValidator empêche http si la valeur est nulle - angulaire, dactylographie, angular2-forms, angular2-observables, validation-angulaire

J'ai créé un AsyncValidator vérifier l'unicité de userName.

Basé sur ce Par exemple, j’ai ajouté un délai de 500 ms.

Cependant, je ne sais pas comment empêcher le service d’appeler (http), si la valeur en entrée ne passe pas une exigence spécifique.

import { Injectable } from "@angular/core";
import { AsyncValidator, AbstractControl } from "@angular/forms";
import { Observable } from "rxjs/Rx";
import { UsersService } from "../services/UsersService";
import "rxjs/add/operator/map";
import "rxjs/add/operator/debounceTime";

@Injectable()
export class UniqueUserNameAsyncValidator implements AsyncValidator {
constructor(private usersService: UsersService) {

}

validate(c: AbstractControl): Promise<any> | Observable<any> {
return Observable.timer(500).switchMap(() => {
if(!c.value || c.value.length < 4) {
// TODO
// prevent call to service if the control value is null / empty

// return null; // Doesn"t work
}

return this.usersService.getByName(c.value)
.map(p => {
return { uniqueUserName: true };
});
});
}
}

Réponses:

0 pour la réponse № 1

Pourquoi ne pas retourner les exigences? changer le code comme

validate(c: AbstractControl): Promise<any> | Observable<any> {
return Observable.timer(500).switchMap(() => {
if(c.value || c.value.length >= 4) {
return this.usersService.getByName(c.value)
.map(p => {
return { uniqueUserName: true };
});
}else{
//do things you want if requirements are not fulfilled
}

});
}