Focuses the first invalid leaf field's bound control after form submission
focusFirstError
Functionforms/field
projects/forms/field/focus-first-error.ts
Description#
Focuses the first invalid leaf field's bound control after form submission.
Uses errorSummary() from the root FieldState to find all descendant errors,
then iterates to find the first one with a bound UI control and calls
focusBoundControl() on it. Skips group-level validators that have no
bound control (where focusBoundControl() would be a no-op).
Call after submit() fails or after manually touching all fields.
Signature#
focusFirstError(tree: FieldTree)Parameters#
The root FieldTree of the form.
Returns#
boolean true if a field was focused, false if no focusable error found.
async handleSubmit() {
const success = await submit(this.loginForm, async () => { ... });
if (!success) {
focusFirstError(this.loginForm);
}
}