Question

我正在制作一个简单的待办事项应用。我使用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文件中显示todos的部分：

  <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发送一个帖子请求并告诉它名称值是什么来创建的。

Answer 1

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

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>

Answer 2

看起来你有太多的变量来存储数据。您希望它存储在formData中，但它实际存储在newTodo中。

您的HTML应如下所示：

<form>
  <input type="text" placeholder="I need to do..." ng-model="formData.name">
  <button ng-click="addTodo()">Add</button>
</form>

通过我的api发送数据不起作用

2 个答案: