传递params:到Web API可以使用$ http.get而不是$ http.Post

时间:2018-04-25 06:04:47

标签: angularjs asp.net-web-api2

AngularJS 1.59

此API调用适用于$http.get

JS ViewModel

  $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;
      });
}

APIController

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

但由于这是一个Create函数,我想使用$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:需要传递到config$http.get中的$http.post。这两种方法有不同的签名。

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 ViewModel

  $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;
      }); }

1 个答案:

答案 0 :(得分:3)

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

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