iSharkFly-Docs/angular-docs-cn
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(forms): make the forms validation guide specify more clearly what happens when mixing HTML5 native validators with Angular forms. (#42377)

Browse Source 
Previously, the docs didn't say anything about the fact that the `novalidate` attribute is added to the enclosing form, or how to override that behavior. I have added a couple lines in the appropriate spot clarifying this issue.

PR Close #42377
This commit is contained in:
Dylan Hunn
2021-05-26 18:34:42 -07:00
committed by Andrew Kushnir
parent e0381a87c9
commit c54643f00e
3 changed files with 4 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
aio/content/guide/reactive-forms.md
-10
View File
@@ -379,16 +379,6 @@ In the `ProfileEditor` component, add the `Validators.required` static method as
</code-example>
HTML5 has a set of built-in attributes that you can use for native validation, including `required`, `minlength`, and `maxlength`. You can take advantage of these optional attributes on your form input elements. Add the `required` attribute to the `firstName` input element.
<code-example path="reactive-forms/src/app/profile-editor/profile-editor.component.html" region="required-attribute" header="src/app/profile-editor/profile-editor.component.html (required attribute)"></code-example>
<div class="alert is-important">
**Caution:** Use these HTML5 validation attributes *in combination with* the built-in validators provided by Angular's reactive forms. Using these in combination prevents errors when the expression is changed after the template has been checked.
</div>
**Display form status**
When you add a required field to the form control, its initial status is invalid. This invalid status propagates to the parent form group element, making its status invalid. Access the current status of the form group instance through its `status` property.