Signal Forms: support FormUiControl in Template & Reactive Forms#67267
Open
alxhub wants to merge 9 commits intoangular:mainfrom
Open
Signal Forms: support FormUiControl in Template & Reactive Forms#67267alxhub wants to merge 9 commits intoangular:mainfrom
alxhub wants to merge 9 commits intoangular:mainfrom
Conversation
If `FormsModule` or `ReactiveFormsModule` is present in the scope of a template, plain `<input>` and other form elements will get default CVA directives added. This commit adds an `ngNoCva` attribute as a negative selector for those directives, so `<input ngNoCva>` elements will not have them matched.
Delay the selection of a CVA until after the `ɵɵcontrol` instruction has a chance to execute. This is necessary to delay the error that would be thrown for a missing CVA until after we have a chance to recognize we're actually on an FVC/FCC.
…nterop Add `nativeElement` and a few other affordances to the control instruction implementation.
Previously we were only adding the `ɵɵcontrol` instruction on property bindings. This commit fixes that bug by adding matching on attributes as well.
Adds detection of the `ɵngControlCreate` special lifecycle hook to the JIT compiler.
Relocate some utility code into `@angular/forms` instead of the signal-forms specific entrypoint, to facilitate their reuse in existing template & reactive forms.
Introduces an internal signal that tracks whether `Validators.required` is in the set of validators for an `AbstractControl`. This signal is updated whenever the validators are changed.
…ontrol Update `NgControl` to support binding to custom controls via the new `ngControlCreate` and `ngControlUpdate` lifecycle hooks. This will allow Reactive and Template-driven forms to integrate with components that use the new "Functional Value Accessors" (FVC) architecture. Key changes: - Implement synchronization of control state between `FormControl` and custom controls. - Add support for `parseErrors` signals from custom controls, integrating them into the Reactive Forms validation loop via a dynamic validator. - Convert Reactive Forms errors into `ReactiveValidationError` objects for consumption by custom controls. - Update `NgModel`, `FormControlDirective`, and `FormControlName` to provide necessary dependencies (`Injector`, `Renderer2`) to `NgControl`. - Rename `setUpControl` to `setUpControlValueAccessor` to clarify its role in the traditional CVA path.
Implement support for `FormUiComponent`s in both Reactive and Template-driven
forms. This allows components that use the new signal-based form control
architecture to be used seamlessly within existing Angular form paradigms.
Key changes:
- Integrated `ɵngControlCreate` and `ɵngControlUpdate` lifecycle hooks into
`NgModel`, `FormControlDirective`, and `FormControlName`.
- Implemented branching logic to choose between the traditional `ControlValueAccessor` (CVA) path and the new FVC path based on the host element's capabilities.
- Added comprehensive unit tests for FVC integration in both Reactive (`reactive_fvc.spec.ts`) and Template-driven (`template_fvc.spec.ts`) forms, covering:
- Value synchronization (model -> view and view -> model).
- Status synchronization (touched, dirty, valid, invalid, pending, required).
- Error propagation and `parseErrors` support.
- Fallback behavior to native DOM properties (disabled, required) when FVC inputs are missing.
- Graceful fallback to CVA when no FVC pattern is detected.
- Refined `NgModel` to correctly handle `required` validation via its existing `RequiredValidator` directive while supporting FVC for other properties.
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.
In this PR, we implement support in template & reactive forms for the new style of Signal Forms control: