我正在制作一个简单的待办事项应用程序。我在前端使用angular,在后端使用nodejs。经过一些调试之后,我现在可以使用Postman将数据发布到mongodb数据库中,尽管当我在网站上进行数据创建时,会在数据库上创建一个新对象,但是没有赋予该对象的值。

这是我的模型以及如何连接到数据库:

var mongoose.connect('mongodb://localhost:27017/tododb');
var Todo = mongoose.model('Todo', {
name: String });

这是我处理请求的方式:
app.post('/api/todos', function(req, res){
  Todo.create({name: req.body.name, checked: false},
  function(err, todo){
    if(err) res.send(err);
    Todo.find(function(err, todos){
      if(err) res.send(err);
      res.json(todos);
    });
  });
});

我还使用bodyparser处理数据:
app.use(bodyParser.urlencoded({ extended: true }));

这是我在前端(AngularJS)上的函数:
$scope.formData = {};
$scope.addTodo = function() {
    $http.post('/api/todos', $scope.formData)
        .success(function(data) {
            $scope.todos = data;
            $scope.formData = {}; // clear the form so our user is ready to enter another
            console.log(data);
        })
        .error(function(data) {
            console.log('Error: ' + data);
        });
    };

另一个问题是$scope.formData = {}不会清除输入字段。

最后,这是我的html文件中显示待办事项的部分:
  <h1>Things you have to do</h1>
  <li ng-repeat="todo in todos">
    <p id="todobox"> {{ todo.name }} </p>
  </li>
  <form>
    <input type="text" placeholder="I need to do..." ng-model="newTodo">
    <button ng-click="addTodo()">Add</button>
  </form>

这是我访问localhost:300/api/todos时得到的结果
[{"_id":"57275afef11dc77b17a90eda","__v":0},

{"_id":"57275b5ef11dc77b17a90edb","name":"test from postman","__v":0}]

第一个是通过单击添加按钮在我的输入框中创建的,第二个是通过与Postman发送发帖请求并告诉其名称值来创建的。

最佳答案

[编辑]您是否尝试过更改输入并确保使用.:

JS

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

的HTML
  <h1>Things you have to do</h1>
  <li ng-repeat="todo in info.todos">
    <p id="todobox"> {{ todo.name }} </p>
  </li>
  <form>
    <input type="text" placeholder="I need to do..." ng-model="info.newPost">
    <button ng-click="addTodo()">Add</button>
  </form>

关于javascript - 通过我的api发送数据不起作用,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36984394/

10-09 16:09
查看更多