Effect in parent has no effect despite change in signal in child (Angular 18)

In the child, I have a field data and on a click I alter contents of it. Then, I want an effect in the parent to fire detecting said change. For some reason, the effect doesn't fire when I alter the model input in the child (however, the effect fires when setting the signal in the parent.

The child has this.

export class ChildComponent {
data = model({} as Vm);
onClick() {
console.log("Click alters the data.");
// this.data.set(this.data());
this.data.update(a => a);
}
}


The parent has this.

export class ParentComponent {

constructor() {
interval(1000).subscribe(a => console.log("poll: ", this.data()));
effect(() => { console.log("effect: ", this.data()) });
}
data = signal({} as Vm);
ngOnInit() { this.data.set(this.getData()); }
}


I see the intial effect displaying an empty object. Then, I see the update from parent's init method. I also see the secondwise check displaying the value altered in the child. Yet - the effect won't fire again, only the aforementioned twice.

I'm out of ideas on how to troubleshoot it further. Checking the official docs, I see that it's supposed to work (which it, sort of, does!) but I'm entirely certain if I perform the alteration in the child component fully correctly.

(In the actual scenario, I'll be only altering a field in an object in an array that is a part of the data model input but that's the next step. First, I want to understand why doing set(...) nor update(...) triggers the effect in the partent.

Continue reading...