How to pass parameter in DELETE request in Angular2

1.4k views Asked by At

I am trying to create a Delete request in Angular 2.

What I have done is something like this-

import { Component } from '@angular/core';
import { Http, RequestOptions, URLSearchParams } from '@angular/http';
//import { Http, Response, Headers, RequestOptions, URLSearchParams } from '@angular/http';
import { Profile } from '../../dataModel/Profile.ts';   //Data Model

@Component({
    selector: 'profile-list',
    template: require('./profileList.component.html'),
    styles: [require('./profileList.component.css')]
})

export class ProfileListComponent
{
    private _deleteProfileUrl: string = "/api/Profile/Delete";

    constructor(private http: Http)
    {
    }

    public deleteProfile(profileId)
    {
        this.http.delete(this._deleteProfileUrl, new RequestOptions({
            // Have to make a URLSearchParams with a query string
            search: new URLSearchParams('profileId=' + profileId) // <-----
        }));

        alert("Deleted - " + profileId);
    }
}

So, I am creating a Delete request like this-

this.http.delete(this._deleteProfileUrl, new RequestOptions({
        // Have to make a URLSearchParams with a query string
        search: new URLSearchParams('profileId=' + profileId) // <-----
    }));

but it is not working and not giving any error.

Because if the deleteProfile function is called, only alert is coming, but no AJAX request is done.

Because I am having something like this after the function is called-

enter image description here

I am assuring that API is working perfectly.

So, can anyone please help me what I am doing wrong?

Moreover-

My complete code can be found here (if needed).

Thanks in advance for helping.

1

There are 1 answers

0
yurzui On BEST ANSWER

Observables are lazy. You have to subscribe on them to make the request execute even if you don't want to handle the response. So you can write as follows:

this.http.delete(this._deleteProfileUrl, new RequestOptions({
     search: new URLSearchParams('profileId=' + profileId)
   })).subscribe(res => {
     alert("Deleted - " + profileId);
   });