Angular reactive forms and custom validations

When using reactive forms in Angular we usually avoid template based validation like required, maxlength and so on. Instead we use the Validators in the @angular/forms like this:

Note: in the above code, fb is an instance of FormBuilder which is injected into the constructor.

However, sometimes we want to implement a custom logic for our validations. Scenarios like checking a property value based on another property or checking whether two entered email addresses are equal.


Users who have LIKED this post:

  • avatar
Spread the love

Setting up VSTS CI/CD for a SPA app using AngularCLI, ASPNetCore (Part 2)

In my previous post I showed you how to setup a build pipeline for a SPA application written in Angular using Angular CLI and ASP.Net Core as back-end. I promised back then to continue with the release as well, but have been pretty busy lately.

Now is the time to pay my debt and show you how you will get the release done to make it a proper continuous delivery right from when you commit the code to when it is deployed to production.

We will be using Azure Web Apps for our deployment purposes but it really doesn’t matter where you deploy it since there are many third party tools covering different providers like AWS.


Spread the love

How to use nested form groups using ReactiveForms in Angular

Full source code here.

Before I start, let’s see what does reactive mean.

When talking about reactive forms, it means that we are avoiding to use ngModel, required and so on. This means that instead of showing that Angular is taking care of the form for us, we can use the underlying APIs to do so. In a simpler term instead of using template driven model binding, we can construct our own form and the way they should be bound, validated and so on. For more information please refer to Angular documentation here.

Now if you are creating a form in Angular using Reactive Forms and you a complex object to bind to i.e. your form has multiple sections and each of them should be bound to a child object, then you can simply use FormControl on an input like this:


Spread the love