Creating a complex form with input validation
In this section, you will build an app to demonstrate form validation using ngForm
and ngControl
. Here is a screenshot of the form:
If the user tries to submit without providing valid information, the form will show the following error:
Basically, the Name field is required. The Phone field is the number type, but is optional. The Comment field is required and the user must enter at least four characters. Of course, this is just for demonstration of the input length. The user, finally, must agree to the terms and conditions via the toggle input.
After a successful validation, the user will be taken to the second screen with a summary of the previous screen, as illustrated in the following screenshot:
Getting ready
This app example could work either in a browser or on a physical device. However, you can optionally connect your physical device to verify the Phone field for number keypad.
How to do it…
Observe the following the instructions:
- Create...