Search code examples
angulardata-bindingangular-ngmodelangular-forms2-way-object-databinding

Why do we need two way data binding in angular login forms?


I am going through this code on github: https://github.com/linnovate/mean and there is something I do not understand. When you look at the register form html code there is no two-way data binding and that I understand since there is no need for them.

My confusion starts when I look at the login form html code.

So my questions are:

  1. Why is there two-way data binding on the login inputs? Is it to auto populate the input fields automatically using cookies? If so, how does the component communicate with the browser as I cannot see the code in the login.component.ts code?
  2. If question 1. is true, why does the register form html code not have two-way data binding yet when I key in my email it automatically fills up the FullName input? How is this achieved without two-way data binding?

Thanks in advance.


Solution

  • They just do that to avoid having to pull data themselves from the form using something like form.controls.email.get('email').value. With their binding, they directly have the value of the fields in this.email in the component, and thus can use the simple line 22 in the ts file:

    this.authService.login(this.email, this.password)
    

    So, there is no cookies or server-side stuff involved. It is just frontend variable handling.