title: Angular + asp.net: Delete and update requests doesn't work
body: <p>Hi i am trying to write an app with angular + asp.net + mssql. Controllers works on backend but when calling DELETE and UPDATE in agular they doesn't work. POST and GET does.</p>
  <p>Error: <a href="https://i.stack.imgur.com/l5JNe.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/l5JNe.png" alt="enter image description here" /></a></p>
  <p>I guess it should be https://localhost:44348/Games/{id} but it is /Games/<strong>:</strong></p>
  <p>No idea where the problem is.
  My controller:</p>
  <pre><code>        [HttpDelete(&quot;{id}&quot;)]
      public async Task&lt;IActionResult&gt; DeleteGame(int id)
      {
          var query = new DeleteGameCommand(id);
          var result = await _mediatr.Send(query);
          return result != null ? Ok() : NotFound();
      }
  </code></pre>
  <p>My service in angular:</p>
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  import { Observable } from 'rxjs';
  
  @Injectable({
    providedIn: 'root'
  })
  export class SharedService {
    readonly APIUrl = &quot;https://localhost:44348&quot;
  
    constructor(private http:HttpClient) { }
  
    getGameList():Observable&lt;any[]&gt;{
      return this.http.get&lt;any&gt;(this.APIUrl+'/Games');
    }
  
    addGame(val:any){
      return this.http.post(this.APIUrl+'/Games',val);
    }
  
    updateGame(val:any){
      return this.http.put(this.APIUrl+'/Games/', val);
    }
  
    deleteGame(val:any){
      return this.http.delete(this.APIUrl+'/Games/',val);
    }
  
    getGamesByName(val:any){
      return this.http.get&lt;any&gt;(this.APIUrl+'/Games/', val);
    }
  }
  </code></pre>
  <p>Angular component.html</p>
  <pre><code>&lt;tbody&gt;
          &lt;tr *ngFor=&quot;let dataItem of GameList&quot;&gt;
              &lt;td&gt;{{dataItem.id}}&lt;/td&gt;
              &lt;td&gt;{{dataItem.name}}&lt;/td&gt;
              &lt;td&gt;{{dataItem.description}}&lt;/td&gt;
              &lt;td&gt;{{dataItem.avaiable}}&lt;/td&gt;
              &lt;td&gt;{{dataItem.fee}}&lt;/td&gt;
              &lt;td&gt;
                  &lt;button type=&quot;button&quot; class=&quot;btn btn-light mr-1&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#exampleModal&quot; 
                  (click)=&quot;editClick(dataItem)&quot; 
                  data-backdrop=&quot;static&quot; 
                  data-keyboard=&quot;false&quot; &gt;
                  Update&lt;/button&gt;
                  &lt;button type=&quot;button&quot; class=&quot;btn btn-light mr-1&quot; (click)=&quot;deleteClick(dataItem)&quot;&gt;
                  Delete&lt;/button&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  </code></pre>
  <p>And Angular component.ts</p>
  <pre><code>import { Component, OnInit } from '@angular/core';
  import { SharedService } from 'src/app/shared.service';
  @Component({
    selector: 'app-show-game',
    templateUrl: './show-game.component.html',
    styleUrls: ['./show-game.component.css']
  })
  export class ShowGameComponent implements OnInit {
  
    constructor(private service:SharedService) { }
  
    GameList: any = [];
    ModalTitle:string =&quot;&quot;;
    ActiveAddEditGameComp:boolean=false;
    game:any;
  
  
    ngOnInit(): void {
      this.refreshGameList();
    }
  
    addClick(){
      this.game={
        id:0,
        name:&quot;&quot;,
        description:&quot;&quot;,
        avaiable:0,
        fee:0
      }
      this.ModalTitle=&quot;Add Game&quot;;
      this.ActiveAddEditGameComp = true;
    }
  
    editClick(item: any){
      this.game=item;
      this.ModalTitle=&quot;Edit Game&quot;;
      this.ActiveAddEditGameComp=true;
    }
  
    closeClick(){
      this.ActiveAddEditGameComp=false;
      this.refreshGameList();
    }
  
    deleteClick(item:any){
  
       this.service.deleteGame(item).subscribe(data =&gt; {
         alert(data.toString());
         this.refreshGameList();
       })
    }
  
    refreshGameList(){
      this.service.getGameList().subscribe(data =&gt; {
        this.GameList=data;
      });
    }
  }
  </code></pre>
  <p>Any idea?</p>