Angular Validation With ng-Pattern Using Regular Expression

In this blog, let's discuss how to validate a form with AngularJS ng-pattern using regular expressions.

Background

Most of the times, we have to create form with validate input fields. Then we require to write code in JavaScript or server-side code for validation .This blog will show you how to achieve validation with reg-ex very easily.

Below, I have created a demostration example.

Step 1

We create HTML file and include reference of AngularJS file from CDN.

Step 2

We create ng-app, ng-controller, and inject module.

Step 3

We create Controller in JavaScript .

Step 4

We use ng-pattern for giving regular expression.

Step 5

We create span or div for hiding and showing when user input is $dirty or $invalid value.

One thing that you should keep in mind is - ng-pattern given name tag is required in input box and textarea. You can also create common JSON file for all forms accessing regx and given value in $rootscope.

Summary

I hope, you understood how to use regular expression in AngularJS ng-pattern.