I have a parent component named A with over 20 child components, all of which extend A and are located within
<ng-content></ng-content>showContent variable in multiple places.
The issue arises because I am using *ngIf="showContent" in all child components. Unfortunately, the views of the child components do not reflect changes when the value in A is updated. In order to address this problem, I have considered two options:
A) Utilize Output + EventEmitter, although I am hesitant about duplicating code like below in every child component:
onValueChange(val: boolean) {
this.showContent = val;
}
B) Explore the use of async pipe. However, one challenge is that I am updating the value within GET/POST subscriptions, as shown below:
this.httpDataHandler.get<...>(...).subscribe(response => {
// lots of stuff
showContent = true;
});
Is there a solution that allows me to utilize the async pipe while eliminating redundant code in all child components?