how to Add multiple component in parent component with Angular6

Question

In parent.component.html

I have the following HTML

<button type="button" class="btn btn-secondary (click)="AddComponentAdd()">Address</button> 
<app-addresse *ngFor="let addres of collOfAdd" [add]="addres"></app-addresse>

and in parent.component.ts

private collOfAdd: Array<AddresseComponent> = [];

AddComponentAdd() {
    this.collOfAdd.push(AddresseComponent); 
}

and in addresse.component.ts

 @Input() add: string;

How do I make the component <app-addresse> appear several times in the parent component by clicking the button present in parent component?

Suresh Kumar Ariya · Accepted Answer · 2018-08-06 11:06:35Z

1

I also created a stackblitz link. https://stackblitz.com/edit/angular-lnyec5

answered Aug 6, 2018 at 11:06

Suresh Kumar Ariya

9,8041 gold badge22 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sivakumar Tadisetti Over a year ago

@Fat16 I didn't get how the above stackblitz code worked for you? there is no button in the answer provided?

Fat16 Over a year ago

I made changes to your solution !

prakarsh gupta · Accepted Answer · 2018-08-06 11:46:09Z

0

I have created a stackblitz for your question please check the below url: https://stackblitz.com/edit/angular-tihubf

In this reference you can find hello.component loaded multiple times on click of button.

edited Aug 6, 2018 at 11:46

answered Aug 6, 2018 at 11:04

prakarsh gupta

801 silver badge7 bronze badges

Collectives™ on Stack Overflow

how to Add multiple component in parent component with Angular6

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related