docs(material/input): add example for showing errors from a parent form group - #33822
Open
RAJEEV2510 wants to merge 1 commit into
Open
RAJEEV2510 wants to merge 1 commit into
RAJEEV2510 wants to merge 1 commit into
Conversation
…rm group Errors from a validator on a parent form group, such as a check that two fields match, are set on the group instead of the input, so `mat-error` doesn't show them by default. Add an example that uses an `ErrorStateMatcher` to show a parent group's error on the related input. Fixes angular#8513
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #8513
Errors from a validator on a parent
FormGroup, such as a check that two fields match, are set on the group rather than on the input. The input's own control stays valid, so<mat-error>never shows them by default. This comes up often (see the issue thread), and the docs don't cover it.input-parent-form-errorsexample: a password and confirm-password form with a group-levelpasswordsMismatchvalidator, and anErrorStateMatcherthat shows that group error on the confirm field once it has been interacted with or the form is submitted.input.mdunder "Changing when error messages are shown", right after the existinginput-error-state-matcherexample.src/components-examples/material/input/index.ts.Docs-only; no library code changes.
Verification
bazel build //src/components-examples/material/input:input //src/components-examples:docs-contentsucceeds, and the example appears in the generated docs content.ng-dev format,tslintandstylelintpass on the changed files.