Angular Email Validator, How to implement to update? Its possible parameters

Question

I have apply a specific email validator, it works when I create the user, but if I try update any user, the email validator sends message email in use.

In another words its behaviour when I create, but I need when I update the user if id and email were equals, allow the user.

Is It possible through parameters?

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { AbstractControl, AsyncValidator, FormControl, FormGroup, ValidationErrors, ValidatorFn } from '@angular/forms';
import { Observable, Subject } from 'rxjs';
import { map } from 'rxjs/operators';
import { url } from 'src/app/config/config';

@Injectable({
  providedIn: 'root'
})
export class EmailValidatorService implements AsyncValidator {

  constructor( private http: HttpClient ) { }

  validate( control: AbstractControl): Observable<ValidationErrors | null> {

    const email: string = control.value;
   
    return this.http.get<any[]>( url +'email?email=' + email )
                .pipe(
                  map( (resp: any) => {
                    
                    let respuesta = null;
                    if( resp == null ) {
                      respuesta = null;
                    } else {
                      if (resp.user == null ) {
                        respuesta = null;
                      } else {
                        if( (email.localeCompare(resp.user.email) == 0) ) {
                          respuesta = { email_in_use: true} ;
                        } else {
                          respuesta = null;
                        }
                     
                      }
                    }
                    return respuesta;
                  })
                );

  }

  
}

What is returned by the HTTP call made here? (And BTW, the whole function can be shortened to `/* ... */ .map((resp: any) => resp?.user?.email === email ? { email_in_use: true } : null)`). — mbojko, Jan 26 '21 at 22:03
A lot of thanks, but is it possible apply this for update user? Or I need pass a parameters? Thanks again mbojko — ProgramaClases, Jan 26 '21 at 22:20

score 0 · Answer 1 · answered Jan 28 '21 at 16:21

import { HttpClient } from '@angular/common/http';
import { AbstractControl, AsyncValidatorFn, FormBuilder, FormControl, FormGroup, ValidationErrors, ValidatorFn } from '@angular/forms';
import { UserCreateComponent } from 'src/app/components/users/user-create/user-create.component';
import { url } from 'src/app/config/config';
import { Observable, Subject } from 'rxjs';
import { map } from 'rxjs/operators';
import { resolve } from 'url';
import { Injectable } from '@angular/core';


@Injectable({
  providedIn: 'root'
})

/**
 * Class for async validations communicating with the REST-API.
 */
export class MailValidator {
  static EmailUpdateValidator(UserCreateComponent: UserCreateComponent): AsyncValidatorFn {
    return (control: AbstractControl): Observable<ValidationErrors> => {

      let email = UserCreateComponent.gradientForm.get('email').value;
      if (email == null) {
        return null;
      }
      let id = UserCreateComponent.id;
      return UserCreateComponent.http.get<any[]>(url + 'usuarios/emailInUse?email=' + UserCreateComponent.gradientForm.get('email').value)
        .pipe(
          map((resp: any) => {

            let respuesta = null;
            if (resp == null) {
              return respuesta = null;
            } else {
              if (resp.user == null) {
                return respuesta = null;
              } else {
                if ((email.localeCompare(resp.user.email) == 0)) {
                  if (id == resp.user.id) {
                    return respuesta = null;
                  } else {
                    return respuesta = { email_in_use: true };
                  }

                } else {
                  return respuesta = null;
                }

              }
            }
            return respuesta;
          })
        )
    };
  }
}

I can solve this problem create a new validator In component

this.gradientForm = this.fb.group({
    id: [value.id],
    name: [value.name, Validators.required],
    surname: [value.surname, Validators.required],
    email: [value.email, [Validators.required, Validators.email ],[MailValidator.EmailUpdateValidator(this)] ],
    user: [value.user, Validators.required],
    password: [value.password, Validators.required]
  });

Please if my code can(could) be better ,let me know.

Angular Email Validator, How to implement to update? Its possible parameters

1 Answers1