Angular async validator using firestore

Question

I want to make a custom async validator in my Angular project.

I'm using firestore for my DB, and the structure of it is

colloection (profiles) - doc ( email, username )

this is my form code,

   this.registerForm = this.formBuilder.group({
      email : ['', Validators.compose([Validators.required, Validators.email]), this.emailCheck.bind(this) ],
      password : ['', Validators.required],
      confirmPassword : ['', Validators.compose([Validators.required, this.isEqualPassword.bind(this)])]
  })

but i don't know how to make this.emailCheck.bind(this) function.

what I did is

emailCheck(control: FormControl)  {
  control.valueChanges
      .debounceTime(1500)
      .switchMap(val => this.emailValid(val))
      .subscribe((res) => {
        return res ? null : {emailAvailable : true}
      })



 emailValid(val) : Observable<any> {
  let ref = this.afs.collection(`profiles`, ref => ref.where('email', '==', val))
  return ref.valueChanges()

and then I get error

please let me know how to fix this.

stackoverflow.com/questions/35521583/…

R. Richards
– R. Richards

2018-01-24 05:52:37 +00:00
Commented Jan 24, 2018 at 5:52 — R. Richards
– R. Richards, Commented Jan 24, 2018 at 5:52

nicowernli · Accepted Answer · 2018-01-24 06:56:41Z

1

Check official documenation on how to create custom validation on angular

Basically what you have to do is create a function that returns a Promise or Observable with the errors or null.

emailCheck(control: FormControl): Observable<{[key: string]: any}>  {
  return control.valueChanges
      .debounceTime(1500)
      .switchMap(val => this.emailValid(val))
      .map(res => res ? null : {emailAvailable : true})

answered Jan 24, 2018 at 6:56

nicowernli

3,34826 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular async validator using firestore

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related