title: angular 4 odata Delete/Post not working
body: <p>I have created a simple test class to use to make my http request to an OData API (both running on my local machine, with CORs enabled). My OData Service looks like so:</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  
  import { Http, Response, RequestOptionsArgs, Headers } from '@angular/http';
  
  import { Observable } from 'rxjs';
  import 'rxjs/add/operator/map';
  
  import { IUrlOptions } from './odata.model';
  import { RequestTypes } from './odata.model';
  
  @Injectable()
  export class ODataService {
  
      constructor(
          private host: string,
          private http: Http
      ) {  }
  
  
      private constructUrl(urlOptions: IUrlOptions): string {
          return this.host + urlOptions.restOfUrl;
      }
  
  
  
      //T specifies a generic output of function
      public Request&lt;T&gt;(requestType: RequestTypes, urlOptions: IUrlOptions, body?: any, options?: RequestOptionsArgs) : Observable&lt;T&gt; {
          let response: Observable&lt;Response&gt;;
  
          if(requestType == RequestTypes.delete){
              response = this.http.delete(this.constructUrl(urlOptions), options);
          } else if(requestType == RequestTypes.get){
  
              response = this.http.get(this.constructUrl(urlOptions), options);
          } else if (requestType == RequestTypes.post){
              response = this.http.post(this.constructUrl(urlOptions), body, options)
          }
  
          return response.map((res) =&gt; &lt;T&gt;res.json());
      }
  }
  </code></pre>
  
  <p>Now i have a component to test this service:</p>
  
  <pre><code>import { Component, OnInit } from '@angular/core';
  
  import { ODataService } from './odata.service';
  import { RequestTypes } from './odata.model';
  import { IUrlOptions } from './odata.model';
  
  import  { Template } from '../../models/template.model' 
  
  @Component({
      selector: 'odata',
      templateUrl: 'odata.component.html'
  })
  export class ODataComponent implements OnInit {
  
  
      public requestResult: any;
  
      constructor(
          private odata: ODataService
      ) { }
  
      ngOnInit() { }
  
      testGet() {
          let urlOptions: IUrlOptions = &lt;IUrlOptions&gt;{};
          urlOptions.restOfUrl = "Template";
          this.odata.Request(RequestTypes.get, urlOptions).subscribe(
              data =&gt; this.requestResult = data,
              error =&gt; alert(error)
          );
      }
  
      testPost() {
          let urlOptions: IUrlOptions = &lt;IUrlOptions&gt;{};
          urlOptions.restOfUrl = "Template";
          let body = new Template();
          body.Name = "Test3";
          body.Private = false;
          body.User = "chp";
  
          let jsonBody = JSON.stringify(body);
  
          this.odata.Request(RequestTypes.post, urlOptions, jsonBody).subscribe(
              data =&gt; this.requestResult = data,
              error =&gt; alert(error)
          );
      }
  
      testPut() {
          let urlOptions: IUrlOptions = &lt;IUrlOptions&gt;{};
          this.odata.Request(RequestTypes.put, urlOptions).subscribe(
              data =&gt; this.requestResult = data,
              error =&gt; alert(error)
          );
      }
  
      testPatch() {
          let urlOptions: IUrlOptions = &lt;IUrlOptions&gt;{};
          this.odata.Request(RequestTypes.patch, urlOptions).subscribe(
              data =&gt; this.requestResult = data,
              error =&gt; alert(error)
          );
      }
  
      testDelete() {
          let urlOptions: IUrlOptions = &lt;IUrlOptions&gt;{};
          urlOptions.restOfUrl = "Template(6)"
          this.requestResult = this.odata.Request(RequestTypes.delete, urlOptions);
      }
  
  }
  </code></pre>
  
  <p>Ignoring the Put and Patch as they have not been implemented the only service that seems to work is GET. POST and DELETE does not seem to work at all; calling DELETE <a href="http://localhost:53219/Template(6)" rel="nofollow noreferrer">http://localhost:53219/Template(6)</a> should delete the Template with ID 6, which works when done using SOAP UI but not using the this.http.delete(...) function defined in the first code snippet. </p>
  
  <p>Furthermore looking at the network recordings on chrome it does not look like a delete request is ever made, am I missing something to call the function?</p>
  
  <p>My SOAP UI Request is as follows:</p>
  
  <pre><code>DELETE http://localhost:53219/Template(6) HTTP/1.1
  Accept-Encoding: gzip,deflate
  Content-Type: application/json
  Content-Length: 83
  Host: localhost:53219
  Connection: Keep-Alive
  User-Agent: Apache-HttpClient/4.1.1 (java 1.5)
  </code></pre>
  
  <p>Any help would be appreciated</p>