Question

我已经构建了一个rest-API来在mongodb中添加待办事项。我可以使用邮递员中的以下设置成功保存实例：

http://localhost:3000/api/addtodo x-www-form-urlencoded with values text =＆＃34; Test＆＃34;，completed：＆＃34; false＆＃34;。

现在当我尝试使用Angular复制它时，它不起作用，todo被保存但没有文本和已完成的属性，我似乎无法从正文访问文本或完成的值。我究竟做错了什么？代码如下：

角-HTML：

<div id="todo-form" class="row">
            <div class="col-sm-8 col-sm-offset-2 text-center">
                <form>
                    <div class="form-group">

                        <!-- BIND THIS VALUE TO formData.text IN ANGULAR -->
                        <input type="text" class="form-control input-lg text-center" placeholder="I want to buy a puppy that will love me forever" ng-model="formData.text">
                    </div>

                    <!-- createToDo() WILL CREATE NEW TODOS -->
                    <button type="submit" class="btn btn-primary btn-lg" ng-click="createTodo()">Add</button>
                </form>
            </div>
        </div>

Angular-js：

  $scope.createTodo = function() {
    $http.post('/api//addtodo', $scope.formData)
        .success(function(data) {
            $scope.formData = {}; // clear the form so our user is ready to enter another
            $scope.todos = data;
            console.log(data);
        })
        .error(function(data) {
            console.log('Error: ' + data);
        });
};

REST-API：

router.post('/addtodo', function(req,res) {
  var Todo = require('../models/Todo.js');
  var todo = new Todo();

  todo.text = req.body.text;
  todo.completed = req.body.completed;

  todo.save(function (err) {
    if(!err) {
      return console.log("created");
    } else {
      return console.log(err);
    }
  });

  return res.send(todo);

});

Answer 1

$http.post使用application/json而不是application/x-www-form-urlencoded发送数据。 Source

如果您正在使用正文解析器，请确保已包含JSON中间件。

app.use(bodyParser.json());

或更改角度的默认标题。

module.run(function($http) {
    $http.defaults.headers.post = 'application/x-www-form-urlencoded';
});

使用Angular.js中的帖子不起作用

1 个答案: