AngularJS 将参数传递给 Web Api 获取答案

【问题标题】：AngularJS pass Parameter to Web Api GetAngularJS 将参数传递给 Web Api 获取
【发布时间】：2016-11-30 18:50:12
【问题描述】：

我正在尝试将对象参数从 angularJs 控制器传递到 Web Api 2 Get Method 控制器。

如果我传递像字符串这样的对象，它会起作用，但我不喜欢这个解决方案。

[HttpGet]
public IEnumerable<SearchVenueByParameters_Result> Get(string parameter)
    {
        ObjSearch obj_search = new JavaScriptSerializer().Deserialize<ObjSearch>(parameter);

我想试试这个：

[HttpGet]
    public IEnumerable<SearchVenueByParameters_Result> Get(ObjSearch obj_search)

ObjSearch 类：

public class ObjSearch {
    public string aAMSID { get; set; }
    public string venueName { get; set; }
    public string address { get; set; }
    public byte? businessSK { get; set; }
    public string subjectAamsCode { get; set; }
    public string subjectDenomination { get; set; }
    public string subjectVatNumber { get; set; }
    public string subjectTaxCode { get; set; } }

在 angularjs 控制器中我有：

 $scope.objSearch = {
        "aAMSID": "",
        "venueName": "",
        "address": "",
        "businessSK": "",
        "subjectAamsCode": "",
        "subjectDenomination": "",
        "subjectVatNumber": "",
        "subjectTaxCode": ""
        }

$scope.searchVenueByParameters = function () {

    var strObjSearch = angular.toJson($scope.objSearch);
    console.log(strObjSearch);
    $http({
        url: '/api/SearchVenueByParameters_Result/',
        method: 'GET',
        params: { obj_search: strObjSearch }
    }).success(function (data) {
        $scope.Venues = data;
        $scope.VenueList = true;
        $scope.showItem = true;

})
   .error(function () {
       $scope.error = "An Error has occured while loading posts!";
   });
    }

但在这种情况下，我已从 angularjs 控制器中更正了控制台中打印的值，但在 web abi 控制器中传递的对象始终为空。

【问题讨论】：

标签： angularjs asp.net-web-api

【解决方案1】：

使用 GET 发送复杂对象时，请使用 [FromUri] 属性直接从 URL 创建对象。

在客户端中，将对象添加到参数中

$http({
    url: '/api/SearchVenueByParameters_Result/',
    method: 'GET',
    params: $scope.objSearch
}).success(function (data) {
    $scope.Venues = data;
    $scope.VenueList = true;
    $scope.showItem = true;

URL 将被翻译成类似的东西

/api/SearchVenueByParameters_Result/?aAMSID=1&venueName=1&address=1&businessSK=1&subjectAamsCode=1&subjectDenomination=1&subjectVatNumber=1&subjectTaxCode=1

并在控制器中，添加 [FromUri] 属性

[HttpGet]
public IEnumerable<SearchVenueByParameters_Result> Get([FromUri]ObjSearch obj_search)

你可以阅读更多关于属性here

【讨论】：

@FrancescoGaleota GET 请求是没有正文的设计。所以 [FromBody] 不能与 GET 一起使用。

【解决方案2】：

您应该使用 Post 将对象发送到 WEB API。用这些替换你的代码

 $scope.objSearch = {
        "aAMSID": "",
        "venueName": "",
        "address": "",
        "businessSK": "",
        "subjectAamsCode": "",
        "subjectDenomination": "",
        "subjectVatNumber": "",
        "subjectTaxCode": ""
        }

$scope.searchVenueByParameters = function () {

    var strObjSearch = angular.toJson($scope.objSearch);
    console.log(strObjSearch);
    $http({
        url: '/api/SearchVenueByParameters_Result/',
        method: 'POST',
        params: { obj_search: strObjSearch }
    }).success(function (data) {
        $scope.Venues = data;
        $scope.VenueList = true;
        $scope.showItem = true;

})
   .error(function () {
       $scope.error = "An Error has occured while loading posts!";
   });
    }

[HttpPost]
public IEnumerable<SearchVenueByParameters_Result> Get(string parameter)
    {
        ObjSearch obj_search = new JavaScriptSerializer().Deserialize<ObjSearch>(parameter);

【讨论】：