Przemysław Zamorski Przemysław Zamorski - 13 days ago 5
TypeScript Question

Remove component itself

I cant find out the solve if this problem.

I have 2 components:

@Component({
selector: 'my-app',
template : `
<product *ngFor="let prod of products" [product]='product'>
`
})
export class App {
public products =['object',object]; //its only example of products objects array
}

@Component({
selector: 'product',
template : `
<p>{{product.name}}</p>
`
})

export class App {
@Input() product:any;
}


Right now how can i delete one specyfic product component? May be component can do this itself?
I check this posts and still dont have any idea
Angular 2 - Adding / Removing components on the fly and How to destroy all the Components created using DynamicComponentLoader in angular2?

In app the product list will be downloaded from serwer and displayed like this. I want to add a button to remove single product it self from the list. Right now i have a function which deletes this product from server but i think its a stupid idea to download the list of product again. So i think it will be beter remove it from from the DOM maybe with ElemntRef or ComponentRef

Answer

Just remove the item from products and the <product> component will be removed by *ngFor.

Besides that, there is no way to remove components added by Angular2. You can only remove components that you added yourself.