Add component to dom on click of button in angular2

Question

I have personInvolved component. This component has personDetails component. There is a button in personInvolved component. Onclick of the button I need to append the personDetails on DOM. each time I click it should append the personDetails component. How can I achieve this.

Answer 1

Use *ngFor:

    <button (click)="addPerson()">Add person</button>
    <person-details *ngFor="let person of persons" [person]="person"></person-details>

And in the component code:

    persons: Array<Person> = [];

    addPerson() {
        this.persons.push(new Person());
    }