AngularJs 将 $http POST 转换为 $resource POST

Question

我正在寻找有关如何使用 $resource POST 数据的示例。我目前有这个使用 $http 的工作代码，但想使用 $resource.

来简化它

return $http.post("http://localhost:8080/calculate", JSON.stringify(formData))
               .then(function (response) {
                    if (typeof response.data === 'object') {
                        return response.data;
                    } else {
                        // invalid response
                        return $q.reject(response.data);
                    }
                }, function (response) {
                    // something went wrong
                    return $q.reject(response.data);
                });

我尝试四处搜索示例，但未能找到适合这种情况的示例。

Answer 1

您首先为 Calculate 创建一个 $resource class 表示，如第一个所示。

此资源 class 具有保存功能，可让您 POST 随心所欲地保存数据。

angular.module('myApp.services').factory('Calculate', function($resource) {
  return $resource('http://localhost:8080/calculate');
});

angular.module('myApp.controllers').controller('ResourceController',function($scope, Calculate) {
  $scope.calc = new Calculate(); //You can instantiate resource class

  $scope.calc.data = JSON.stringify(formData);

  Calculate.save($scope.calc, function() {
      // Callback function to run once the data is saved.
  });
});

Answer 2

像这样定义您的资源：

angular.module('app')
.factory('MyResource', function ($resource) {
  return $resource('', {}, {
    'calculate': { method: 'POST', url: 'http://localhost:8080/calculate' }
  });
});

或者这个：

angular.module('app')
.factory('MyResource', function ($resource) {
  return $resource('http://localhost:8080/calculate', {}, {
    'calculate': { method: 'POST' }
  });
});

然后就可以使用了：

MyResource.calculate({}, JSON.stringify(formData), onSuccess, onError);

使用第一种方法，您可以在单个资源 (url 属性) 中使用不同的 url 定义不同的操作，这有时很有用，尤其是当您使用的 API 是不统一

当你有相同的端点和不同的请求方法时，第二种方法更好（就像在常规的 RESTfull APIs 中）。在那里你可以用不同的名称定义它们（比如获取、更新、删除等）。

您还可以通过以下方式使用资源：

var result = MyResource.calculate(JSON.stringify(formData));

也可以访问内部 $promise，这样您就可以做一些更复杂的事情。

根据我的经验，重要的是你应该记住 isArray: true 属性，当你的 API returns JSON 数组。

此处描述了所有详细信息：https://docs.angularjs.org/api/ngResource/service/$resource

AngularJs 将 $http POST 转换为 $resource POST

AngularJs convert $http POST to $resource POST

angularjs

angular-resource