Angular reactive forms

In this video we will discuss reactive forms in Angular.

There are 2 ways to create forms in Angular
1. Template Driven Forms
2. Reactive Forms (Also called Model Driven Forms)

Healthy diet is very important for both body and mind. We want to inspire you to cook and eat healthy. If you like Aarvi Kitchen recipes, please support by sharing, subscribing and liking.
https://www.youtube.com/channel/UC7sEwIXM_YfAMyonQCrGfWA/?sub_confirmation=1

Here is the link to Angular CRUD playlist. We discussed Template forms in Part 5.
https://www.youtube.com/playlist?list=PL6n9fhu94yhXwcl3a6rIfAI7QmGYIkfK5

Text version of the video
http://csharp-video-tutorials.blogspot.com/2018/09/angular-reactive-forms.html

Slides
http://csharp-video-tutorials.blogspot.com/2018/09/angular-reactive-forms-slides.html

Angular 6 Tutorial
https://www.youtube.com/playlist?list=PL6n9fhu94yhWNJaDgh0mfae_9xoQ4E_Zj

Angular 6 Tutorial Text Articles & Slides
http://csharp-video-tutorials.blogspot.com/2018/09/angular-6-tutorial-for-beginners.html

Angular, JavaScript, jQuery, Dot Net & SQL Playlists
https://www.youtube.com/user/kudvenkat/playlists?view=1&sort=dd

As the name implies, Template Driven Forms are heavy on the template meaning we create the form completely in HTML. Template driven forms are easy to build and understand. They are great for creating simple forms. However, creating complex forms using template driven approach is not recomended as the HTML can get very complicated and messy. It is not easy to unit test template forms as the logic is in the HTML.

Reactive forms on the other hand allow us to build the form completely in code. This is more flexible and has many benefits over template forms. For example, it is easy to add form input elements dynamically and adjust validation at runtime based on the decisions made in code. It is also easy to unit test as most of the logic and validation is in the component class. The only downside of reactive forms is that they require more code than template forms.

In this video and in our upcoming videos we will discuss everything we need to know to build complex reactive forms.

With a reactive form, we create the entire form control tree in the component class code. Let us understand this by creating a simple form with just 2 form controls as shown below.