Я выполняю уникальную проверку электронной почты в angular 7. в этом коде нет ошибок, но GET-запрос не запускается из-за неиспользования подписки в функции проверки электронной почты. Я также попытался с подпиской в функции проверки, то это дает ошибку. А при использовании Promise в сервисе выдает ошибку в файле проверки.
труба не является функцией
Как это сделать, используя Observable
или Promise
?
обслуживание участников
import { Injectable } from '@angular/core';
import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { IMember, Credential } from './client-schema';
import { Observable, of } from 'rxjs';
import { map, publish } from 'rxjs/operators';
import { environment } from 'src/environments/environment';
import { AuthService } from './services/auth.service';
@Injectable({
providedIn: 'root'
})
export class MemberService {
private _memberCountUrl: string = environment.apiUrl + '/members/count';
constructor(
private http: HttpClient,
private _AuthService: AuthService
) {}
getUserCount(whereCond: string): Observable<any> {
console.log(whereCond);
return this.http.get<any>(`${this._memberCountUrl}?${whereCond}`);
}
}
Директива проверки электронной почты
import { Directive } from '@angular/core';
import { AsyncValidator, AbstractControl, ValidationErrors, NG_ASYNC_VALIDATORS, AsyncValidatorFn } from '@angular/forms';
import { Observable } from 'rxjs';
import { MemberService } from '../member.service';
import { map } from 'rxjs/operators';
export function UniqueEmailValidator(_memberService: MemberService): AsyncValidatorFn {
return (ctrl: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null> => {
console.log(ctrl.value);
return _memberService.getUserCount(ctrl.value).pipe(
map(res => {
return res ? { 'uniqueEmail': true } : null;
})
);
}
}
@Directive({
selector: '[appUniqueEmail]',
providers: [{ provide: NG_ASYNC_VALIDATORS, useExisting: UniqueEmailValidatorDirective, multi: true }]
})
export class UniqueEmailValidatorDirective implements AsyncValidator {
constructor(private _memberService: MemberService) { }
validate(ctrl: AbstractControl): Promise<ValidationErrors | null> | Observable<ValidationErrors | null> {
return UniqueEmailValidator(this._memberService)(ctrl);
}
}
Элемент-член
инициализация формы -
this.profileForm = this.formBuilder.group({
fName: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(250)]],
lName: ['', [Validators.required, Validators.minLength(2), Validators.maxLength(250)]],
email: ['', [
Validators.required,
Validators.pattern(new RegExp('[a-zA-Z0-9.-_]{1,}@[a-zA-Z.-]{2,}[.]{1}[a-zA-Z]{1,}')),
UniqueEmailValidator(this._memberService)
]]
});