Issue
I have some troubles with sending delete request to my backend application. I have a table of products and i want add delete button for each element in table.
Here is my delete method in service:
makeDelete(id: string){
this.httpClient.delete(this.url + '/' + id);
}
My component ts:
export class DrinkComponent implements OnInit {
index: any;
drink: any;
constructor(private drinkService: DrinkService) { }
ngOnInit(): void {
this.drinkService.getIndex()
.subscribe(resp => { this.index = resp });
}
deleteItem(drink: any){
this.drink = drink;
console.log(this.drink.id);
this.drinkService.makeDelete(drink.id);
}
And HTML:
<body>
<div class="table">
<div class="margin">
<div class="header">
<span class="dId">
<strong>DrinkID</strong>
</span>
<span class="pId">
<strong>ProductID</strong>
</span>
<span class="pName">
<strong>Name</strong>
</span>
<span class="pType">
<strong>Type</strong>
</span>
<span class="pQuantity">
<strong>Quantity</strong>
</span>
</div>
<div class="tableHeader">
<div class="tableData" *ngFor="let drink of index">
<span class="drinkId">{{drink.id}}</span>
<span class="productId">{{drink.product.id}}</span>
<span class="drinkName">{{drink.name}}</span>
<span class="drinkType">{{drink.type}}</span>
<span class="productQuantity">{{drink.product.quantity}}</span>
<div >
<button class="deleteButton" type="submit" (ngSubmit)="deleteItem(drink)">DELETE</button>
</div>
</div>
</div>
</div>
</div>
</body>Thanks in advance
Solution
You're using the ngSubmit event when you should be using click. ngSubmit is for forms and what to do when they are submitted.
Try
<button class="deleteButton" type="submit" (click)="deleteItem(drink)">DELETE</button>
Answered By - Donald Duck
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.