ExpressJS AngularJS POST

Question

Ich lerne AngularJS und ich möchte wissen, wie man es richtig mit Node ExpressJS verbindet.

Dies ist mein Controller:

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"); 
     }) 
    } 
}); 

Und das ist mein server.js:

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

Ich habe nicht Körper-Parser verwendet. Ich verstehe nicht, wie Body-Parser verwendet wird, um die Formularwerte aus dem HTML zu erhalten, wenn ich eine Funktion im Controller verwende. Erhalten die Werte aus dem HTML beim Klicken auf "Senden", wenn Body-Parser verwendet wird, oder werden die Werte von der Funktion erhalten, an die ich die Formularwerte als Argumente übergebe. Bitte sag mir wie es gemacht wird.

EDIT: das ist mein html:

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

EDIT 2: voll server.js Code:

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')); 
}); 

EDIT 3: Edited-Controller 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

Der Körper-Parser-Modul für Node.js (Express) können alle Daten aus dem Formular Post zu einem einzigen Objekt erhalten req.body genannt, wenn Sie also ein $scope Objekt haben Ihre Formulardaten definieren Sie direkt, dass die haben, injizieren gleiche Eigenschaften auf req.body kopiert:

Eckig:

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> 

Nun, wenn Sie legt ihn über $http.post('/view1', $scope.formData) Sie werden das gleiche Objekt erhalten, zum Beispiel:

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

Statt mit einem ng Sie auf den Absenden-Button, können Sie auch ng-submit in Form Element wie folgt verwenden:

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

Answer 2

Zunächst Alles was Sie beachten sollten, sind die zwei globalen Variablen req und res.

Wenn Sie auf Post-Anfrage klicken req.body fängt die Anfrage von http und body-parser extrahiert den rohen Inhalt von Post-Anfrage.

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

bevor es zu benutzen müssen Sie

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

enthalten und umfassen Middleware als

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

mehr über middleware, req und res zu

finden Sie

http://expressjs.com/4x