CORS issue while calling WEB API using angular js

See more:

AngularJs

I am creating a demo application which is used to display person details on UI using web api and angular JS. My code is working fine if I am launching Chrome using "chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security", however it's not working for normal Chrome/IE. I did some debugging and found that seems CORS issue. I tried to enable CORS at api end as well but not working for me. Can someone please help me to make it working. Thanks in advance. Below is my code snippet:

WebAPI:
public class HomeController : ApiController
{
public HttpResponseMessage GetPersonDetails()
{
var person = new List<person>
{
new Person {Id=1, Address="Pune", Name="Test1"},
new Person {Id=2, Address="Pune", Name="Test2"},
new Person {Id=3, Address="Pune", Name="Test3"},
new Person {Id=4, Address="Pune", Name="Test4"}
};
return Request.CreateResponse(HttpStatusCode.OK, person);
}
}

angular code:

var appModule = angular.module("MyApp", []);

appModule.controller('getUserDetailsController', function ($scope, $http) {
           $http({
               method: 'GET',
               url: 'http://localhost:61896/api/Home/GetPersonDetails',
               headers: {

                   'Access-Control-Allow-Headers': '*',
                   'Access-Control-Allow-Methods': '*',
                   'Access-Control-Allow-Origin': '*'

               },
               contentType:'text/plain; charset=UTF-8'
           }).then(function (response) {

               $scope.objUserDetails = response.data;


           });
       });

What I have tried:

I tried to enable CORS at api end, also tried to send header from js, but nothing worked for me.