No HTTP resource was found that matches the request URI web api using angularjs

Question

I have created web api and i am consuming it using angularjs and and $http.get is working but $http.post is not showing error

No HTTP resource was found that matches the request URI

here is my controller action

    [HttpPost]
    public object getItem_byRetailerID(int retailerID, DateTime date)
    {
        string msg = null;
        object listItem = new object();
        try
        {
            mf = new milkFactoryEntities();                                
            listItem = mf.p_item_getItem_byRetailerID(retailerID, date);
        }
        catch (Exception ex)
        {
            msg = "Error : " + ex.Message;
        }
        return Json(new { msg = msg, listItem = listItem });
    }

WebApiConfig

public static void Register(HttpConfiguration config)
    {           

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );
            config.Routes.MapHttpRoute(
             name: "api",
            routeTemplate: "login/api/{controller}/{action}"
         );
        config.EnableSystemDiagnosticsTracing();

        var appXmlType = config.Formatters.XmlFormatter.SupportedMediaTypes.FirstOrDefault(t => t.MediaType == "application/xml");
        config.Formatters.XmlFormatter.SupportedMediaTypes.Remove(appXmlType);

    }

here is my angular controller

var param = { retailerID: retailerID, date: $scope.ro.orderDT };
$http.post('http://localhost:60124/api/' + 'retailerOrder/getItem_byRetailerID', JSON.stringify(param)).then(function (d) {        

        console.log(d);
        $scope.listItems = d.data.listItem;

    }, function (error) {
        console.log(error.data);            
    })

please help...

Answer 1

For a HTTP POST, the request payload is read from the request body. You can have at most one query string parameter. It's often easier to have a strongly typed object and send it in the request payload -

self.getData = $http.post('../PostItem_byRetailerID', JSON.stringify(self.data))
.then(function success(a, b) {
    self.data = a;
}, function error(a, b) {
    self.data = false;
});

where Test is -

public class Test
{
    public int retailerID { get; set; }
    public string date { get; set; }
}

sample data -

{"retailerID": 2 ,"date":"test"}

Answer 2

Change your route from

routeTemplate: "api/{controller}/{id}" to

routeTemplate: "api/{controller}/{action}/{id}"

And no need to use JSON.stringify(param), it can just be param