Which @angular/* package(s) are the source of the bug?

forms

Is this a regression?

No

Description

When using Reactive Forms, navigating away from a component that contains form controls causes a memory leak if at least one field has been modified. The form controls and related objects are not released properly, leading to increasing memory consumption over time.

Reproduction steps:

1. Open Stackblitz.
2. Open Chrome DevTools → Performance → Take a Heap Snapshot.
3. Click Details from the toolbar to render form fields.
4. Without making any changes, click Menu from the toolbar to navigate away.
5. Run Garbage Collection (GC) and take another Heap Snapshot.
   • Expected: No detached elements, and memory is restored to the initial state.
6. Repeat Step 3, but this time modify some form fields before navigating away.
7. Take another Heap Snapshot after GC.
   • Issue: The form fields and their controls remain retained in memory, leading to a memory leak.

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/~/github.com/ikamel92/Angular19

Please provide the exception or error you saw

Detached elements are retained in memory.

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 15.1.6
Node: 20.17.0 (Unsupported)
Package Manager: npm 10.8.2
OS: win32 x64

Angular: 15.2.10
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1502.11
@angular-devkit/build-angular   15.2.11
@angular-devkit/core            15.2.11
@angular-devkit/schematics      15.1.6
@angular/cdk                    15.2.9
@angular/cli                    15.1.6
@schematics/angular             15.1.6
rxjs                            7.8.1
typescript                      4.9.5

Anything else?

This issue was original found in v15.1.0