A3–Building App using Angular and ASP.NET Core 2.1 – Form Validation

This post is a part of a series of posts that I am writing as I am building an app using Angular and ASP.NET Core 2.1. Links to previous posts –> A1, A2, Github Repo

Today, my goal was adding form validation to form controls. I added validation to Insert and Edit pages for Product. Validation on both the pages is very similar.

Add Product Validation

Same page but validation changes if you delete price and keep it null.

I learnt couple of things today regarding validation and forms.

1. There are many things to remember in hooking up things with form. For example, creating multiple validation is not that straight forward.

2. Out of the box there are couple of validators but real world scenarios almost always require you to have custom validation.

3. I wish there was an alternative to template variable. I do not like creating these variable on input fields. From an api standpoint it would have been nicer if everything was part of ngModel.

These are my naïve observations and stupid opinions based upon my limited knowledge regarding Angular internals.

Regarding my app, I am realizing that there is more code common between add and edit component. Perhaps I could utilize some shared component here. I am not too concerned with this right now. To get good grasp at validation, I am going to add more fields later.

Next goal is to be able to submit edit, insert, delete product using ASP.NET Web API as backend. Until then have a good night. And code is on GitHub.