Angular+NodeJs+MongoDB搭建前后端程序

get请求：

//angular 前端get请求
this.client.get('http://localhost:3000/id/tom').subscribe(data => {
      console.log(data);
    });

//nodejs后端响应
app.get("/id/:name", function (request, response) {
    var heroName = request.params.name;
    //debugger;
    console.log("name:" + request.params.name);
    heros.find({name:heroName},function(err,heros){
      if(err) return console.error(err);
      response.send(heros);
    });

});

另一种：

// client: HttpClient : @angular/common/http
this.client.get('http://localhost:3000/id', { params: { name: 'tom' } }).subscribe(data => {
      console.log(data);
    });

//var express = require("express");  var app = express();
app.get("/id/", function (request, response) {
    var heroName = request.query.name;
    console.log("name:" + request.query.name);
    heros.find({name:heroName},function(err,heros){
      if(err) return console.error(err);
      response.send(heros);
    });

});

post：

//angular发送post请求
this.client.post<Hero>('http://localhost:3000/hero', hero)
        .subscribe(data => {
          console.log(data);
});

//后台处理post请求
app.post("/hero", function (request, response) {
    var theHero = new heros({name:'',race:[],price:});
    console.log('theHero:' + theHero);
    // theHero.save(function (err, data) {
    //  if (err) return console.error(err);
    //  response.send("post:" + theHero);
    // });

});  

通过Mongoose连接MongoDB,并进行查询和保存数据：

var mongoose=require('mongoose');
mongoose.connect('mongodb://localhost/hero',{config:{autoIndex:false}}); // 进入mongo命令行 show dbs 将看到hero
var db = mongoose.connection;
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', function() {
  console.log("connection success");
});

var heroSchema = new  mongoose.Schema({
  name:String
});
heroSchema.set('autoIndex',false);

heroSchema.methods.display = function () {
  console.log(this.name);
}

var Hero = mongoose.model('heros', heroSchema); //show collections 将看到heros

// 通过model 查询; 在mongo命令行 使用 db.heros.find({name:'tom'})
Hero.find({name:'tom'},function(err,heros){
      if(err) return console.error(err);
      console.log(heros);
});

//通过model创建theHero并保存到mongodb
var theHero = new Hero ({ name: 'tom' });
theHero.save(function (err, data) {
    if (err) return console.error(err);
 });
    

另外，解决跨域与请求带HttpHeaders报错问题：

//后台设置跨域访问
app.all('*', function(req, res, next) {
　 res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Credentials", "true");
    res.header("Access-Control-Allow- Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("Access-Control-Allow-Headers", "Content-Type,Access-Token");
    res.header("Access-Control-Expose-Headers","*");
    next(); //必须有
});

启动mongodb：

mongod --dbpath d:/test

启动nodejs后端服务,通过nodemon启动，修改test.js代码后自动生效：

nodemon test.js   

后台代码：

var express = require("express");
var app = express();
var bodyParser = require('body-parser');
var multer = require('multer');
var upload = multer();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended:true}));

var mongoose=require('mongoose');
mongoose.connect('mongodb://localhost/hero',{config:{autoIndex:false}});
var db = mongoose.connection;
db.on('error', console.error.bind(console, 'connection error:'));
db.once('open', function() {
  console.log("connection success");
});

var heroSchema = new  mongoose.Schema({
  name:String,
  race:[String],
  price:Number
});

heroSchema.set('autoIndex',false);

heroSchema.methods.display = function () {
  var msg = this.name + ":" + this.race.join(",") + ":" + this.price;
  console.log(msg);
}

var heros = mongoose.model('heros', heroSchema);

//设置跨域访问
app.all('*', function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Credentials", "true");
    res.header("Access-Control-Allow-Methods","PUT,POST,GET,DELETE,OPTIONS");
    res.header("Access-Control-Allow-Headers", "Content-Type,Access-Token");
    res.header("Access-Control-Expose-Headers","*");
    // res.header("X-Powered-By",' 3.2.1')
    //res.header("Content-Type", "application/json;charset=utf-8");
    next();
});

app.get("/id/:name", function (request, response) {
    var heroName = request.params.name;
    debugger;
    console.log("name:" + request.params.name);
    heros.find({name:heroName},function(err,heros){
      if(err) return console.error(err);
      response.send(heros);
    });

});

app.get("/id", function (request, response) {
    var heroName = request.query.name;
    console.log("name:" + request.query.name);
    heros.find({name:heroName},function(err,heros){
      if(err) return console.error(err);
      response.send(heros);
    });

});

app.post("/hero",upload.array(), function (request, response) {
    var param = request.body;
    const theHero = new heros({name:param.name,race:param.race,price:param.price});
    console.log('theHero:' +  param.name);

    theHero.save(function (err, data) {
       if (err) return console.error(err);
       response.send({'data':'ok'});
    });

});   

 app.listen(3000);

参考：

angular官方文档HTTPClient

express官方文档request参数

mongoose官方文档

nodejs调试

HttpHeader无法发送

ajax跨域解决方案