ExpressJS AngularJS POST

Question

我正在学习AngularJS，我想知道如何使用ExpressJS正确连接Node。

这是我的控制器：

app.controller('view1Ctrl', function($scope, $http) { 

    $scope.sub = function(desc) { 
     console.log(desc); 
     $http.post('/view1', desc). 
     then(function(response) { 
      console.log("posted successfully"); 
     }).catch(function(response) { 
      console.error("error in posting"); 
     }) 
    } 
}); 

这是我server.js：

app.post('/view1', function(req, res) { 
    console.log(res.desc); 
    res.end(); 
}); 

我没有用身体解析器。当我在控制器中使用一个函数时，我没有得到如何使用body-parser从html获取表单值。在使用body-parser时，点击提交时的值是从html获得的，还是从我传递表单值作为参数的函数获取值？请告诉我它是如何完成的。

编辑：这是我的html：

<form> 
     <input type="text" ng-model="desc" placeholder="Enter desc" /> 
     <button class="btn btn-primary" ng-click="sub(desc)">Submit</button> 
</form> 

编辑2： 全server.js代码：

var express = require('express'), 
    http = require('http'), 
    path = require('path'), 
    bodyParser= require('body-parser'); 

var app = express(); 

app.set('port', 3000); 

app.use(express.static(path.normalize(__dirname + '/'))); 
app.use(bodyParser.json()); // for parsing application/json 
app.use(bodyParser.urlencoded({ extended: true })); // for parsing  application/x-www-form-urlencoded 

app.get('/main', function(req, res) { 
    var name = 'MyNameFromServer'; 
    res.send(name); 
}); 

app.post('/view1', function(req, res) { 
    console.log(res.body.desc); 
    res.end(); 
}); 

http.createServer(app).listen(app.get('port'), function() { 
    console.log('Express server listening on port ' + app.get('port')); 
}); 

编辑3： 编辑控制器app.js

app.controller('view1Ctrl', function($scope, $http) {  
    $scope.sub = function() { 
     console.log($scope.formData); 
     $http.post('/view1', $scope.formData). 
     success(function(data) { 
      console.log("posted successfully"); 
     }).error(function(data) { 
      console.error("error in posting"); 
     }) 
    }; 
}); 

Answer 1

Node.js（Express）的body-parser模块可以从表单发布中获取每个数据到一个名为req.body的对象中，因此如果您有一个$scope对象来定义表单数据，那么您可以直接注入以获得相同的特性复制在req.body：

角：

app.controller('view1Ctrl', function($scope, $http) { 
    $scope.sub = function() { 
     $http.post('/view1',$scope.formData). 
     then(function(response) { 
      console.log("posted successfully"); 
     }).catch(function(response) { 
      console.error("error in posting"); 
     }) 
    } 
}); 

HTML：

<form> 
     <input type="text" ng-model="formData.desc" placeholder="Enter desc" /> 
     <input type="text" ng-model="formData.title" placeholder="Enter title" /> 
     <button type="submit" class="btn btn-primary" ng-click="sub()">Submit</button> 
</form> 

现在，当您通过提交10你会得到相同的对象，例如：

app.post('/view1', function(req, res) { 
    console.log(req.body.desc); 
    res.end(); 
}); 

而不必提交按钮的NG-点击，你也可以在这样的表单元素使用ng-submit：

<form ng-submit="sub()"> 

Answer 2

第一你应该知道两个全局变量req和res。

当您点击发布请求时req.body捕获来自http和body-parser的请求，并从发布请求中提取原始内容。

app.post('/view1', function(req, res) { 
console.log(req.body.desc); 
res.end(); 
}); 

使用它之前，你必须包括

var bodyParser = require('body-parser'); 

，包括中间件作为

app.use(bodyParser.json()); // for parsing application/json 
app.use(bodyParser.urlencoded({ extended: true })); // for parsing  application/x-www-form-urlencoded 

更多middleware，req和res请参考

http://expressjs.com/4x