传递参数：到 Web API 适用于 $http.get 但不适用于 $http.Post

Question

AngularJS 1.59

此 API 调用适用于 $http.get。

JS 视图模型

  $scope.placeOrder = function () { //'api/order/create'
    var order = { AccountId : accountId, Amount : $scope.subTotal,
      Tax: $scope.tax, Shipping: $scope.shipping }
    var orderJSON = JSON.stringify(order);
    viewModelHelper.apiGet('api/order/create', { params: { order: orderJSON } },
      function (result) {
        var orderId = result.data;
      });
  }

App.js

self.apiGet = function (uri, data, success, failure, always) {
  self.isLoading = true;
  self.modelIsValid = true;
  $http.get(AlbumApp.rootPath + uri, data)
      .then(function (result) {
        success(result);
        if (always != null)
          always();
        self.isLoading = false;
      }, function (result) {
        if (failure == null) {
          if (result.status != 400)
            self.modelErrors = [result.status + ': ' + result.statusText +
              ' - ' + result.data];
          else
            self.modelErrors = [result.data + ''];
          self.modelIsValid = false;
        }
        else
          failure(result);
        if (always != null)
          always();
        self.isLoading = false;
      });
}

self.apiPost = function (uri, data, success, failure, always) {
  self.isLoading = true;
  self.modelIsValid = true;
  $http.post(AlbumApp.rootPath + uri, data)
      .then(function (result) {
        success(result);
        if (always != null)
          always();
        self.isLoading = false;
      }, function (result) {
        if (failure == null) {
          if (result.status != 400)
            self.modelErrors = [result.status + ': ' + result.statusText + ' - ' + result.data];
          else self.modelErrors = [result.data];
          self.modelIsValid = false;
        }
        else failure(result);
        if (always != null) always();
        self.isLoading = false;
      });
}

API控制器

[HttpGet]
[Route("create")]
public IHttpActionResult Create(string order) { 
  var _order = JsonConvert.DeserializeObject<Order>(order); ... }

但由于这是一个创建函数，我想使用 $http.post。当我将调用更改为

  $scope.placeOrder = function () { //'api/order/create'
    var order = { AccountId : accountId, Amount : $scope.subTotal,
      Tax: $scope.tax, Shipping: $scope.shipping }
    var orderJSON = JSON.stringify(order);
    viewModelHelper.apiPost('api/order/create', { params: { order: orderJSON } },
      //null,
      function (result) {
        var orderId = result.data;
      });
  }

和我的控制器对

的操作

[HttpPost]
[Route("create")] 
public IHttpActionResult Create(string order) { 
  var _order = JsonConvert.DeserializeObject<Order>(order); ... }

我收到 404 错误：

<Error>
<Message>
No HTTP resource was found that matches the request URI 'http://localhost:50597/api/order/create'.
</Message>
<MessageDetail>
No action was found on the controller 'OrderApi' that matches the request.
</MessageDetail>
</Error>

这是一个错误还是我遗漏了一些概念点或者我的代码有错误？

解决方法：（谢谢 Giovani）

params:需要传递给$http.get和$http.post中的config。这两种方法具有不同的签名。

在 apiGet 中将 data 重命名为 config。在apiPost中添加了一个config.

在 apiPost 调用中添加了一个 null 因此 params: 被传递给 config 而不是 data.

App.js

self.apiGet = function (uri, config, success, failure, always) {
  self.isLoading = true;
  self.modelIsValid = true;
  $http.get(AlbumApp.rootPath + uri, config)
...

self.apiPost = function (uri, data, config, success, failure, always) {
  self.isLoading = true;
  self.modelIsValid = true;
  $http.post(AlbumApp.rootPath + uri, data, config)

JS 视图模型

  $scope.placeOrder = function () { //'api/order/create'
    var order = { AccountId : accountId, Amount : $scope.subTotal,
      Tax: $scope.tax, Shipping: $scope.shipping }
    var orderJSON = JSON.stringify(order);
    viewModelHelper.apiPost('api/order/create', null, { params: { order: orderJSON } },
      function (result) {
        var orderId = result.data;
      }); }

Answer 1

$http.get() 和 $http.post() 具有不同的方法签名。 more info

$http.get(<URL>, <DATA (params, responseType, etc..)>)
$http.post(<URL>, <BODY_DATA>, <DATA (params, responseType, etc..)>

传递参数：到 Web API 适用于 $http.get 但不适用于 $http.Post

Passing params: to Web API works with $http.get but not $http.Post

angularjs

asp.net-web-api2