I am learning Forms in Angular. I made a form and on Submit the form data is shown in a table below. I want to add a delete and edit functionality to that. Kindly guide me.
Below is the stackblitz of the project:
Assuming you have are storing the data you want to remove in a database, you will need to create your buttons reflecting edit and delete, create method for each in your html file , for example
<div class="col-md-2"><button class="btn btn-danger" (click)="delete(std)">DELETE</button></div>
and in your ts file you would insert code such as
//you make a call to your APi which references your backend
delete(person: Persons): void{
this.apiService.deletePerson(person.Id)//method name in your services.ts file
.subscribe(data =>{
this.person = this.person.filter(u => u !==person);
});
as mentioned above, you will also need a call in your services file(please note this example is using php and mysql), such as:
deletePerson(Id: number):Observable<ApiResponse> {
return this.http.delete<ApiResponse>(`http://localhost/angular9crud/delete.php?id=${id}`);
}
If you are using backend, such as php then I recommend watching few youtube videos as there is plenty of information and detailed explanations available