Angular 2 Async Validation

I recently posted about Angular 2 Form validation which didn’t cover asynchronous validation. This post does cover an async validation example …

I’ve put all the classes in the same file to make the example simpler to show and read. The example gives a textbox for the user to enter a product code and validates that the product code exists and puts a description at the side if it does.

Referencing an async validator in FormBuilder

The first key point is that you reference the async validator in the 3rd parameter in None async validators go in the 2nd parameter – I only have a async validator in my example.

Writing the async validator

The async validator needs to return a promise that in turn returns null if valid or something else if not valid. In this example, I am calling a ProductService class to check whether the product exists

Here’s the full listing …

Recommended reading for building great angular apps:

Share this:Share on RedditTweet about this on TwitterShare on LinkedInShare on Google+

One Comment

Leave a Reply

Your email address will not be published. Required fields are marked *