Implementing the OnPush strategy, a service is utilized to update some data. However, upon receiving the data in the component, it requires a click on the screen to reflect the changes.
Parent.ts
// Click initiates the logic
click() {
this.showChild = true;
setTimeout(()=> this.update, 0); // A workaround to display loading in the component until the service provides a value
}
update() {
this.explorer.getData().subscribe(data => {
this.info = {...data};
// this.cdr.detectChanges();
});
}
Parent html
<app-child *ngIf="showChild" [info]="info" [otherVar]="otherVar"></app-child>
Although expecting a reference change through destructuring, the desired result is not observed. Any insights into what might be going wrong?