title: Http client doesn't send a response or send a null - Angular and C# Api
body: <p>I stumbled upon a problem. I got an Angular 5 website and a backend based on C# WebApi. </p>
  
  <p>In my webiste i got a component that is suppouse to send a post request to backend adding new entity to DataBase. Unfortunatelly it doesn't send a request or it isn's recieved on backend.</p>
  
  <p><strong>bet.component.ts</strong></p>
  
  <pre><code>import {Injectable} from '@angular/core';
  import {Service} from './service';
  import {Http, Headers, RequestOptions, Response} from '@angular/http';
  import {AppConfig} from '../app-config';
  import {Bet} from '../models/bet';
  
  @Injectable()
  export class BetService extends Service {
  
    private url = this.config.apiUrl + '/bet';
  
    constructor(private http: Http, private config: AppConfig) {
      super();
    }
  
    addBet(bet: Bet) {
      return this.http.post(this.url + '/add', bet);
    }
  }
  </code></pre>
  
  <p><strong>BetController.cs</strong></p>
  
  <pre><code>using System;
  using System.Threading.Tasks;
  using FakeBet.API.DTO;
  using FakeBet.API.Services.Interfaces;
  using Microsoft.AspNetCore.Authorization;
  using Microsoft.AspNetCore.Mvc;
  
  namespace FakeBet.API.Controllers
  {
      [Route("api/[controller]")]
      public class BetController : Controller
      {
          private IBetService service;
  
          public BetController(IBetService service)
          {
              this.service = service;
          }
  
          [HttpPost("[action]")]
          public async Task&lt;IActionResult&gt; Add([FromBody] BetDTO bet) 
          {
              try
              {
                  await service.AddBetAsync(bet);
                  return Ok();
              }
              catch (Exception ex)
              {
                  return BadRequest(ex.Message);
              }
          }
      }
  }
  </code></pre>
  
  <p>Url is ok. </p>
  
  <p>I tried to change bet.component.ts to </p>
  
  <pre><code>return this.http.post(this.url + '/add', bet).subscribe(x =&gt; console.log('test'));
  </code></pre>
  
  <p>and then the response is recieved on the backend side, but <code>BetDto bet</code> is null.
  While <code>bet</code> is not null and the names of the properties are the same in the object in Angular and Api.</p>
  
  <p>I also tried to send a request using a Postman and it went smooth. Here's how it looks. <a href="https://i.imgur.com/ax2WWxz.png" rel="nofollow noreferrer"><img src="https://i.imgur.com/ax2WWxz.png" alt="request"></a></p>
  
  <p>Can someone tell me where's my mistake? Cheers!</p>
  
  <p><strong>BetDTO</strong></p>
  
  <pre><code>using System;
  using FakeBet.API.Models;
  
  namespace FakeBet.API.DTO
  {
      public class BetDTO
      {
          public Guid BetId { get; set; }
  
          public string MatchId { get; set; }
  
          public string UserId { get; set; }
  
          public int BetOnTeamA { get; set; }
  
          public int BetOnTeamB { get; set; }
      }
  }
  </code></pre>
  
  <p><strong>bet.ts</strong></p>
  
  <pre><code>export class Bet {
    matchId: string;
    userId: string;
    betOnTeamA: number;
    betOnTeamB: number;
  }
  </code></pre>
  
  <ul>
  <li><p>Request using website: <a href="http://pastebin.com/cLgFZHX4" rel="nofollow noreferrer">website request</a></p></li>
  <li><p>Request using Postman:<a href="http://%20pastebin.com/4QFbYWLW" rel="nofollow noreferrer">postman request</a></p></li>
  </ul>