title: how to create existing component multiple times on button click - Angular
body: <p>I'm trying to create a component several times on a button click. The button is in the parent component and when the click "Add more" it will create the child component as many times as they click "Add more". By default there's only one child component showing then when we click on the button the same child component will be added after the existing one.</p>
  
  <p><strong>how to create existing child component multiple times on button click?</strong></p>
  
  <p><strong>Should I use component Factory or just a plain forLoop?</strong></p>
  
  <p><strong>HTML -Child component</strong></p>
  
  <pre><code>&lt;input type="text /&gt;
  </code></pre>
  
  <p><strong>HTML -Parent component</strong></p>
  
  <pre><code>&lt;child-component #childCom&gt;&lt;/child-component&gt;
  
  &lt;button (click)="addMore()"&gt;Add more&lt;/button&gt;
  </code></pre>
  
  <p><strong>TS</strong></p>
  
  <pre><code>@ViewChild('childCom') childCom: ElementRef;
  
  addMore(){
       console.log("child component");
  }
  </code></pre>