在 angularjs 和 Asp .Net Web Api 中使用 http post 传递数据答案

【问题标题】：Pass data using http post in angularjs and Asp .Net Web Api在 angularjs 和 Asp .Net Web Api 中使用 http post 传递数据
【发布时间】：2015-04-16 18:49:58
【问题描述】：

我正在尝试从 angularjs 代码中使用 Web API 的 post 方法，但是我从 $http 发送的数据没有到达 Web API 方法。 planDetailsVM 参数保持为空。以下是我的代码-

Web API 控制器代码-

public class RateCalculationController : ApiController
{

    [HttpPost]
    public RateCalcOutParmDTO GetPlanRateCalculation(PlanDetailsVM planDetailsVM) 
    {
        //planDetailsVM remains null

        RateCalcOutParmDTO rateCalcOutParmDTO = new RateCalcOutParmDTO();

        // Some operation here

        return rateCalcOutParmDTO;
    }
}

这里 planDetailsVM 仍然为空。

AngularJs 代码-

 $http({
    url: key_Url_GetPlanRateCalculation,
    method: 'Post',
    headers: {'Content-Type': 'application/x-www-form-urlencoded'},
    params: $scope.PlanDetails
    }).then(function (result) {
        //Some operation here
   });

路线映射代码-

  public static void Register(HttpConfiguration config)
    {
        // Web API configuration and services

        // Web API routes
        config.MapHttpAttributeRoutes();

        config.Routes.MapHttpRoute(
            name: "DefaultApi",
            routeTemplate: "api/{controller}/{action}/{id}",
            defaults: new { id = RouteParameter.Optional }
        );
        var appXmlType = config.Formatters.XmlFormatter.SupportedMediaTypes.FirstOrDefault(t => t.MediaType == "application/xml");
        config.Formatters.XmlFormatter.SupportedMediaTypes.Remove(appXmlType);
    }

我尝试在此链接AngularJs $http.post() does not send data 上遵循其中一种解决方案，但它对我不起作用。我需要做什么才能让 planDetailsVM 从 AngularJS http post 接收发布的数据？

PlanDetails 数据-

 $scope.PlanDetails = { QuoteName: null, BenefitAmountId: 0, BenefitAmountValue: null, DoD_Id: 0, DoD_Value: null, EPBD_Id: null, EPBD_Value: null, _DisplayMsg: null, _DisplayFlag: false };

【问题讨论】：

您可能应该显示您的路线图。
PlanDetailsVM 对象有哪些属性，$scope.PlanDetails 有哪些属性？对象之间的属性名称需要匹配。
两者具有相同的属性。
你发帖时$scope.PlanDetails的值是什么样的？
另外，尝试将params: 重命名为data:，最后我检查了params: 是$http.get，我不知道它是否适用于两者。

标签： asp.net angularjs asp.net-web-api http-post

【解决方案1】：

按照 Ben 的建议，我只需在 https 发布请求中将键“params:”替换为“data:”即可解决此问题。下面是完成工作的 angularJS 代码-

$http({
url: key_Url_GetPlanRateCalculation,
method: 'Post',
data: $scope.PlanDetails
}).then(function (result) {
    //Some operation here
});

【讨论】：