Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Destroy component by itself - angular2

I have component (main-cmp) with rows from database. For rows I create another component for eg. row-cmp

main-cmp have requested data from database, and parse it as

<row-cmp *ngFor="let row of data" 
     [id]="row.id" 
     [name]="row.name" 
     [value]="row.value">
</row-cmp>

In row-cmp I have declare delete() function who call http request to my backend. Now when response from request is true I want to destroy row-cmp for selected row. Is this possible ?

like image 613
Kacper Polak Avatar asked Oct 19 '16 09:10

Kacper Polak


People also ask

How do you destroy a component in itself?

To make a component destroy itself when the user navigates away from it, you have to make the component call its ngOnDestroy() lifecycle hook when the page unloads. This is done by leveraging the host page's life cycle.

Can an angular component destroy itself?

If you add a component using ViewContainerRef. createComponent() like shown in Angular 2 dynamic tabs with user-click chosen components, then the component can destroy itself when you pass cmpRef to the created component.

Does ngIf destroy component?

Does ngIf destroy component? Angular's ngIf directive does not simply hide and show. It creates and destroys an HTML element based on the result of a JavaScript expression.

How do you destroy components in angular 10?

Need to remove the component manual just click destroy button and removed all dynamic components. Finally, we are able to do create and destroy dynamic components in our applications.


1 Answers

This is not supported. I'd suggest to add an eventemitter

@Output() delete:EventEmitter = new EventEmitter();

and then add an event handler that removes the item from the data array

<row-cmp *ngFor="let row of data;let i=index" (delete)="data.splice(i,1)"
     [id]="row.id" 
     [name]="row.name" 
     [value]="row.value">
</row-cmp>
like image 104
Günter Zöchbauer Avatar answered Sep 20 '22 20:09

Günter Zöchbauer