[Fixed] Why is change detection not triggering on nested dynamic component


I have an issue with change detection on nested dynamic component using content projection.
Change detection is not triggering automatically on the child component, I have to add manual change detection to every actions.

An exemple here : https://stackblitz.com/edit/angular-ivy-k2z661?file=src%2Fapp%2Fapp.component.ts

As you can see, if you click the button, nothing is showing, but when adding the this.cdr.detectChanges() line on the add() function, the content is showing.
Also, you can notice that I’m not using

Is there a way to achieve that without adding the manual change detection everywhere?


So I finally found what was going on. The child view need to be manually attached to the appref. So

private appRef: ApplicationRef

need to be added to the constructor and then, attach the child view:


I’ve updated the Stackblitz.

Leave a Reply

(*) Required, Your email will not be published