Everyone, I am confused between HTML5 validation and Angular Form validation.
I want to know which validation should be used in validating a form HTML5 or angular's own form validation approach.
Please Also consider explaining:
Why and Why Not.
Which is better
Which is more secure.
Those are two completely different things.
On one side, you have the HTML validation. For instance :
<input type="number" name="hour" min="0" max="23">
This is a convenience validation : if you click on the arrows to increase the value, you won't go under 0 or above 23. But nothing prevents you from typing in 25.
Next, you have Angular's form validation. For instance, in the case of a reactive form
this.form = this.formBuilder.group({
hours: ['', [Validators.max(23), Validators.min(0)]]
});
This is a technical validation : Angular checks if the form is valid at every change you make to it.
You can get the state of the form with this.form.valid and this.form.invalid.
If you rely only on HTML, you will rely on the browser's capacity to check for validation. And they aren't that advanced. Plus, your user will be able to edit the DOM and simply override your validation.
In every case when you use Angular, you should use both HTML validation and Angular's form validation. The former one for user experience, the latter one for your business rules.