How to delete item in Angular and PHP - php

Question

I want to delete my item using 'srno' in my angular project. I have passed the 'srno' to the URL but it shows some error.
I checked my PHP code using postman, It is successfully worked.
I can't recognize my .ts file syntax error.
Error :
HttpErrorResponse {headers: HttpHeaders, status: 200, statusText: "OK", url: "http://localhost/angular_crud/delete.php?srno=srno", ok: false, …}
delete.component.ts
import { Component, OnInit } from '#angular/core';
import { FormControl } from '#angular/forms';
import { HttpClient, HttpParams } from '#angular/common/http';
import { ActivatedRoute } from '#angular/router';
interface Delete{
srno: String;
}
#Component({
selector: 'app-delete',
templateUrl: './delete.component.html',
styleUrls: ['./delete.component.css']
})
export class DeleteComponent implements OnInit {
delete: Delete[] = [];
srno : String;
myControl1 = new FormControl();
constructor(private http: HttpClient, public route: ActivatedRoute) { }
ngOnInit() {
}
personDelete(){
this.srno = this.myControl1.value;
var url = "http://localhost/angular_crud/delete.php?srno=srno";
this.http.get<Delete[]>(url).subscribe(data => {
this.delete = data;
console.log(data);
})
}
}
This is the delete.component.html
<h1 style="text-align: center">Adding Items here!</h1>
<div>
<p>
<mat-form-field appearance="outline" class="form_field">
<mat-label>Serial Number</mat-label>
<input [formControl]="myControl1" matInput placeholder="Enter the Serial number">
<mat-icon matSuffix>sentiment_very_satisfied</mat-icon>
<mat-hint>ie : 787</mat-hint>
</mat-form-field>
</p>
</div>
<button (click)="personDelete()" mat-raised-button color="warn" class="btn">Delete</button>
This is the delete.php
<?php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET,POST,DELETE');
header("Access-Control-Allow-Header: H-Requested-With");
$con = mysqli_connect("localhost","root", "", "savedata");
$srno = $_GET["srno"];
if($con->connect_error){
die("Connection failed: " . $con->connect_error);
}
$sql = "DELETE FROM savedata WHERE srno='$srno'";
if($con->query($sql) === TRUE){
echo "Record delete successfully";
}
else{
echo "Error deleting record: ". $con->error;
}
$con->close();
?>

Answer 1

Your API doesn't return JSON. Try
this.http
.get(url, {responseType: 'text'})
.subscribe(data => {
console.log(data);
});