angularJS post CORS

Issue

I am new to AngularJS and still learning. I have this angularJS code below to check my log-in credentials in my API. But upon log-in(clicking my log-in button) it does not hitting my break point in my API Code. Both API and Log-in codes are running from my local machine. I attached the picture for the CORS error.

AngularJS

data = {username:'user', password:'pass' }

app.service('services', function ($http, $window) {
services = {};
//Set the link once in upon open of project

localStorage.setItem('link', 'http://localhost:63763/');

var surl = localStorage.getItem('link');

services.signin = function (data) {
    var result = $http({
        method: 'POST',
        url: surl + 'api/auth/signin', data: data,
    }).then(function (response) {
        return response;
    }, function (err) {
        return err;
    });
    return result;
};
   return services;
});

API

    [HttpPost]
    [Route("signin")]
    public IHttpActionResult Authenticate([FromBody] UsersSigninDTO dto)
    {
      //Codes            
    }

Class DTO

public class UsersSigninDTO
{
    [Required(ErrorMessage = "username is required.")]
    public string username { get; set; }
    [Required(ErrorMessage = "password is required.")]
    public string password { get; set; }
}

[Error Picture]

Solution

I solve it. On API Code side I added these code under the WebApiConfig.cs

config.MapHttpAttributeRoutes();
EnableCorsAttribute CorsAttribute = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(CorsAttribute);

Answered By - KiRa