I have ponent (main-cmp) with rows from database. For rows I create another ponent 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 ?

I have ponent (main-cmp) with rows from database. For rows I create another ponent 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 ?

• javascript
• angular
• typescript

1 Answer 1

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>