Which @angular/* package(s) are the source of the bug?
forms
Is this a regression?
No
Description
I'm building a demo app with signal forms against TripPin Service .
export interface Person {
UserName: string;
FirstName: string;
LastName: string;
Emails: Array<string>;
AddressInfo: Array<Location>;
Gender: PersonGender | null;
Concurrency: number;
Friends?: Array<Person>;
Trips?: Array<Trip>;
Photo?: Photo | null;
}
I build the form
personModel = signal<Person>({
AddressInfo: [],
Trips: [],
Friends: [],
UserName: '',
Concurrency: 0,
Emails: [],
FirstName: '',
Gender: PersonGender.Unknown,
LastName: ''
});
personForm = form(this.personModel, (schemaPath) => {
required(schemaPath.FirstName);
// ...
});
Load data into the form via a Tanstack Query that doesn't refetch
constructor(){
effect(() => {
if (this.personQuery.isSuccess()){
this.personModel.set(this.personQuery.data());
}
})
}
On the UI, there's a timeline that displays the Person Trips, and you can remove a Trip or add a new one via a dedicated, separate form. This is the code to add/remove:
protected addTrip(trip: Trip) {
this.personModel.update(p => ({...p, Trips: [...p.Trips ?? [], trip]}));
}
protected removeTrip(trip: Trip) {
this.personModel.update(p => ({...p, Trips: p.Trips?.filter(t => t.TripId !== trip.TripId) ?? []}));
}
The timeline display gets it's data from personModel().Trips. I'm not binding [field]="personForm.Trips" nor reading from personForm.Trips().value(). Anyway, this shouldn't matter: I'm testing without any changes made to the Trips array.
For submission I got a button that calls
async saveChanges(){
await submit(this.personForm, async (f) => {
// API call(s)
})
}
On first saveChanges call I get
_structure-chunk.mjs:990 Uncaught (in promise) Error: RuntimeError: orphan field, can't find element in array <root>.Trips
at ChildFieldNodeStructure.keyInParent.ngDevMode.debugName [as computation] (_structure-chunk.mjs:990:15)
at Object.producerRecomputeValue (_effect-chunk.mjs:310:25)
at producerUpdateValueVersion (_effect-chunk.mjs:102:8)
at computed2 (_effect-chunk.mjs:271:5)
at Object.computation (_structure-chunk.mjs:862:40)
at Object.producerRecomputeValue (_effect-chunk.mjs:310:25)
at producerUpdateValueVersion (_effect-chunk.mjs:102:8)
at _FieldNode.computed2 (_effect-chunk.mjs:271:5)
at Object.source (_structure-chunk.mjs:1131:24)
at Object.producerRecomputeValue (_linked_signal-chunk.mjs:63:37)
and the action code is never reached. Second call produces same error, third call succeeds.
Please provide a link to a minimal reproduction of the bug
No response
Please provide the exception or error you saw
_structure-chunk.mjs:990 Uncaught (in promise) Error: RuntimeError: orphan field, can't find element in array <root>.Trips
at ChildFieldNodeStructure.keyInParent.ngDevMode.debugName [as computation] (_structure-chunk.mjs:990:15)
at Object.producerRecomputeValue (_effect-chunk.mjs:310:25)
at producerUpdateValueVersion (_effect-chunk.mjs:102:8)
at computed2 (_effect-chunk.mjs:271:5)
at Object.computation (_structure-chunk.mjs:862:40)
at Object.producerRecomputeValue (_effect-chunk.mjs:310:25)
at producerUpdateValueVersion (_effect-chunk.mjs:102:8)
at _FieldNode.computed2 (_effect-chunk.mjs:271:5)
at Object.source (_structure-chunk.mjs:1131:24)
at Object.producerRecomputeValue (_linked_signal-chunk.mjs:63:37)
Please provide the environment you discovered this bug in (run ng version)
Angular CLI : 21.0.2
Angular : 21.0.3
Node.js : 22.14.0
Package Manager : npm 11.5.2
Operating System : win32 x64
Anything else?
No response
Which @angular/* package(s) are the source of the bug?
forms
Is this a regression?
No
Description
I'm building a demo app with signal forms against TripPin Service .
I build the form
Load data into the form via a Tanstack Query that doesn't refetch
On the UI, there's a timeline that displays the
PersonTrips, and you can remove aTripor add a new one via a dedicated, separate form. This is the code to add/remove:The timeline display gets it's data from
personModel().Trips. I'm not binding[field]="personForm.Trips"nor reading frompersonForm.Trips().value(). Anyway, this shouldn't matter: I'm testing without any changes made to theTripsarray.For submission I got a button that calls
On first saveChanges call I get
and the action code is never reached. Second call produces same error, third call succeeds.
Please provide a link to a minimal reproduction of the bug
No response
Please provide the exception or error you saw
Please provide the environment you discovered this bug in (run
ng version)Anything else?
No response