4

I am working on AngularJS PWA App (Have form in my registration component)

Form have 3 step:

STEP 1

  • First Name
  • Last Name
  • Email
  • Password
  • Phone Number

STEP 2

  • example
  • example

STEP 3

  • example
  • example

When my user will finish first step I have radio buttons:

 <div class="radio">
        <label><input type="radio" name="step2" formControlName="step2" value="1"> Fortsæt</label>
        <label><input type="radio" name="step2" formControlName="step2" value="2"> Ring mig op</label>
 </div>

Code:

this.rForm.get('step2').valueChanges.subscribe(
    (step2) => {
        // here I have user registration width angularfire2
        this.afAuth.auth.createUserWithEmailAndPassword(email, password).then(function(user) {
    }
});

when user click one of radio button, this code will register user in firebase, but if user will click again second radio button, code will try register user again and I am getting error in my console (email alaready exits..).

what is solution for this? I want register user only first time touch to radio button. I am not using here submit, because I have another fields and steps. I want register user only first step.

Vivz
  • 6,625
  • 2
  • 17
  • 33

1 Answers1

2

You can use the first or take operator

import 'rxjs/add/operator/first';
this.rForm.get('step2').valueChanges.first().subscribe(

this.rForm.get('step2').valueChanges.take(1).subscribe(

See also Angular 2 using RxJS - take(1) vs first()

Günter Zöchbauer
  • 623,577
  • 216
  • 2,003
  • 1,567
  • Getting error when .valueChanges.first.subscribe: roperty 'subscribe' does not exist on type '{ (this: Observable, predicate: (value: T, index: number, source: Observable – Gocha Gochitashvili Sep 04 '17 at 09:18
  • Sorry, `first` is a function, not a property. I forgot `()` – Günter Zöchbauer Sep 04 '17 at 09:19
  • this works, but now I have small problem: first time click step2 = 1 second time click step2=2 so if step2=2 I am showing another form inputs, but width this code second click not working anymore – Gocha Gochitashvili Sep 04 '17 at 09:23
  • Sorry, I don't seem to understand your last comment. Perhaps you need to call `this.rForm.get('step2').valueChanges.subscribe(...` again after a click. – Günter Zöchbauer Sep 04 '17 at 09:29