Question

我试图将Angular用于CRUD操作，但是我在向服务器发送POST请求时遇到了一些麻烦。

这是我的控制人员：

angular.module('myModule').controller("ListingCtrl", function($scope, posts) {

    $scope.addProject = function () {
        if (!$scope.title || $scope.title === '') {
            return;
        }
        posts.create({
            title: $scope.title,
            short_description: $scope.short_description
        });
        $scope.title = '';
        $scope.short_description = '';
    };

});

这是我的服务：

angular.module('myModule', [])
.factory('posts', [
    '$http',
    function($http){
    var o = {
        posts: []
    };
    return o;
}]);

o.create = function(post) {
    return $http.post('linktomyliveAPI', post).success(function(data){
        o.posts.push(data);
    });
};

最后，以下是观点：

<div ng-controller="ListingCtrl">

<form ng-submit="addProject()">
    <input type="text" ng-model="title"></input>
    <input type="text" ng-model="short_description"></input>
    <button type="submit">Post</button>
</form>

我已经能够成功发出GET请求，但出于某种原因，我无法弄清楚POST。

如果重要的话，我的API是使用Django Rest Framework构建的。

谢谢！

Answer 1

我认为您添加创建方法的方式不合适，您必须在工厂对象上添加该方法

将create方法放在从工厂返回的对象上。

在您的服务中

angular.module('myModule', [])
  .factory('posts', ['$http',function($http){
      var create = function(post) {
          return $http.post('linktomyliveAPI', post).success(function(data){
            o.posts.push(data);
          });
      };

      var o = {
         posts: [],

         // expose create method on factory object
         create: create
      };

      return o;
}]);

希望这些可以解决您的问题。

Answer 2

修正了它。

我必须更改一些服务器端设置才能使其正常工作。

使用$ http（REST）

2 个答案: