How to access values from subscribed angular form?

Question

I have an angular form with fields such as first name, last name, email, etc. I am subscribing to the values being changed and would like to access and show the values in the html as sort of a review/confirm and submit feature.

this.addEmployeeForm.valueChanges.subscribe(
  values => {
    console.log("VALUES", values);
    if(values.hasOwnProperty('firstName')){
      console.log(values.firstName)
      this.defaultData.push(values.firstName);
    }
  }
)

I was hoping to have these values in the default data, then loop through the default data array. The problem I am having is, since it is a subscription, it pushes every single key change into the array. Is there nay way I can access the final full name?

score 0 · Answer 1 · answered Dec 11 '20 at 22:52

You can either add a debounce time to the subscription, or create a form to which you subscribe only when submitted, so that you eventually get all the data. Adding debounce is the easiest to achieve given your code, and heres a good answer

Putting your code inside a form then subscribing to that form so that you get all the values within it is probably the best option, but might be slightly outside the scope of your question

How to access values from subscribed angular form?

1 Answers1