How to disable submit button in Angular forms based on validation

In Angular we can add specific rules to a form input field, such as required, minlength etc and then apply visual change in and user friendly feedback.


In order to use validation rule you may need to know the validation of Angular forms, the following posts will help you.

Conditionally disable button

We can use property binding in button to conditionally disable the control. Suppose you want to enable the button only if all the validation succeed, the following do the job

<button [disabled]="!todoForm.valid" type="submit" class="btn btn-primary">Submit</button>

That is all about validation. Following angular form post may help you

Published by


A developer,teacher and a blogger obsessed with Python,Dart and open source world from India

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.