How to dynamically add a child component in the parent component

I have a child and a parent component as following:

<app-parent>
<app-child> </app-child>
</app-parent>


How can I dynamically increase the number of children shown in the parent component? Something like I click on a button in the parent component and then a new child be added, like below:

<app-parent>
<app-child> </app-child>
<app-child> </app-child>
</app-parent>

Continue reading...