Deleting row by id not working in core web API + Angular 9

I am trying to delete the column by passing id from Angular 9+ to ASP.NET Core Web API, but I am not able to hit in the controller. What mistake I have done here? I am using table data to run SQL queries.


public class SettlementController : ControllerBase
    public IConfiguration Configuration { get; }
    private readonly DatabaseContext _context;

    public SettlementController(IConfiguration configuration, DatabaseContext context)
        Configuration = configuration;
        _context = context;

    // Delete settlement by id
    public IActionResult DeleteSettlementById([FromBody] SettlementModel model) //sealed class of having Id only
        var tid = model.Id;

            string sConn = Configuration["ConnectionStrings:ServerConnection"];

            using (SqlConnection con = new SqlConnection(sConn))
                List<Object> objList = new List<Object>();

                // This is the stored procedure. I pass in the "Id"
                string query = "ST_PRO_DELETESETTLEMENT"; 

                using (SqlCommand cmd = new SqlCommand(query))
                    cmd.CommandType = CommandType.StoredProcedure;
                    cmd.Parameters.Add("@TID", SqlDbType.VarChar).Value = tid;

                    cmd.Connection = con;

                    using (SqlDataReader reader = cmd.ExecuteReader())
                        while (reader.Read())
                                //TID = reader[0].ToString(),


                return Ok(objList);
        catch (Exception ex)
            throw ex;

settlementService.ts file:
 deleteSettlement(id) {
     return this.http.delete(this.BaseURL + 'Settlement/DeleteById/' + id);

Typescript file:
deleteSettle(tid) {
    console.log(tid);  // getting tid in console

    if (confirm('Are you sure to delete this record ? TID: '+ tid)) {
            (data: any) => {
                this.toastr.success("Successfully deleted");
            err => {
               if (err.status == 400)
                  this.toastr.error('Server error or bad request', 'Error');
                  this.toastr.error('Failed to check data', 'Server Error');


DELETE https://localhost:44372/api/Settlement/DeleteById/355 404


Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Your route path has been overridden by this attribute [HttpDelete("{id}")]

So just remove the Route attribute and add your attribute like this


Next you need to remove the [FromBody] attribute in the method parameters and write like this
public IActionResult DeleteSettlementById(int id)

Hope it helps – Happy coding 🙂

All methods was sourced from or, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Notify of

Inline Feedbacks
View all comments
Would love your thoughts, please comment.x