Javascript 使用Express、Node和Rest从AngularJS发布数据
我是javascript堆栈的新手,一直在尝试从angular到mongo的表单帖子。我可以得到一个列表回来,但不能张贴 下面的代码列出了ok,但当我发布时,它会发布一条空白记录(而且,即使我没有在页面上执行任何操作,它也会每隔几分钟发布一次) 我可以看到它能够调用服务器端方法,但是数据没有被传递到持久性 我知道我在做一些愚蠢的事情,但只是不确定那是什么。我已经在谷歌搜索过了,但是没有看到我可以采取的解决方案。任何帮助都将不胜感激Javascript 使用Express、Node和Rest从AngularJS发布数据,javascript,angularjs,node.js,express,restful-architecture,Javascript,Angularjs,Node.js,Express,Restful Architecture,我是javascript堆栈的新手,一直在尝试从angular到mongo的表单帖子。我可以得到一个列表回来,但不能张贴 下面的代码列出了ok,但当我发布时,它会发布一条空白记录(而且,即使我没有在页面上执行任何操作,它也会每隔几分钟发布一次) 我可以看到它能够调用服务器端方法,但是数据没有被传递到持久性 我知道我在做一些愚蠢的事情,但只是不确定那是什么。我已经在谷歌搜索过了,但是没有看到我可以采取的解决方案。任何帮助都将不胜感激 ============jade================
============jade================
div(ng-app="sell" ng-controller="sellCtlr")
.container-fluid
form#listingForm.form-horizontal
.form-group
.row
.col-xs-8
label.control-label(for="title") title
input#title.form-control(type="text", name="title", ng-model="listing.title")
.form-group
.row
.col-xs-8
label.control-label(for="subTitle") sub-title
input#subTitle.form-control(type="text", name="subTitle",, ng-model="listing.subTitle")
.........
.........
.form-group
.col-xs-6
button.btn.btn-primary(type="submit" ng-click="createListing()") Submit
============app.js================
/* server side controllers **/
var listController = require('./server/controllers/list-controller');
/* routes */
var sell = require('./client/routes/sell');
/* rest api */
app.get('/api/listings', listController.list);
app.post('/api/listings', listController.create);
/* sell route */
app.use('/sell', sell);
============sell.js (sell route)================
var express = require('express');
var router = express.Router();
/* GET sell page. */
router.get('/', function(req, res, next) {
res.render('sell', { title: 'Express' });
});
/* POST sell page. */
router.post('/api/listings', function(req, res, next) {
res.render('sell', { title: 'Express' });
});
module.exports = router;
============sellCtlr.js (client side)================
var app = angular.module('sell', ['ngResource']);
app.controller('sellCtlr', ['$scope', '$resource',
function($scope, $resource){
var Listing = $resource('/api/listings');
$scope.listing = new Listing();
$scope.createListing = function(){
Listing.save($scope.listing, function(){
//data saved. do something here.
});//saves an entry. Assuming $scope.listing is the Listing object
};
}]);
============list-controller.js (server side)================
var Listing = require('../models/listing');
// save listing
module.exports.create = function (req, res) {
var listing = new Listing(req.body);
listing.save(function (err, result){
res.json(result);
});
}
//retrieve all listings
module.exports.list = function(req, res){
Listing.find({}, function(err, results) {
res.json(results);
});
}
============listing.js (model, server side)================
var mongoose = require('mongoose');
module.exports = mongoose.model('Listing', {
title: String,
subTitle: String
});
非常感谢各位
编辑2——完整的app.js文件
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
/*%%%%% server side controllers %%%%%%**/
var listController = require('./server/controllers/list-controller');
/*%%%%% server side controllers %%%%%%**/
/*%%%%% mongoose config %%%%%%**/
var secrets = require('./config/secrets');
var mongoose = require('mongoose');
//Connect to the MongoDB
mongoose.connect(secrets.db);
/*%%%%% mongoose config %%%%%%**/
/*%%%%% routes %%%%%%**/
var index = require('./client/routes/index');
var listing = require('./client/routes/listing');
var users = require('./client/routes/users');
var sell = require('./client/routes/sell');
/*%%%%% routes %%%%%%**/
/*%%%%% express setup %%%%%%**/
var app = express();
/*%%%%% express setup %%%%%%**/
/*%%%%% view engine setup %%%%%%**/
app.set('views', path.join(__dirname, 'client/views'));
app.set('view engine', 'jade');
/*%%%%% view engine setup %%%%%%**/
/*%%%%% client side directories %%%%%%**/
app.use(express.static('client'));
app.use(express.static('client/views'));
app.use('/js', express.static(__dirname + '/client/js'));
app.use('/js', express.static(__dirname + '/client/views/js'));
app.use('/css', express.static(__dirname + '/client/views/css'));
/*%%%%% rest api's %%%%%%**/
app.get('/api/listings', listController.list);
app.post('/api/listings', listController.create);
/*%%%%% rest api's %%%%%%**/
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use('/', index);
app.use('/users', users);
app.use('/sell', sell);
// catch 404 and forward to error handler
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// error handlers
// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {}
});
});
module.exports = app;
您没有正确注册模型,需要使用
mongoose.Schema
。我很惊讶你没有出错
var mongoose = require('mongoose');
module.exports = mongoose.model('Listing', new mongoose.Schema({
title: String,
subTitle: String
}));
编辑1:
将save()调用更改为以下内容:
$scope.createListing = function(){
$scope.listing.$save();
};
编辑3
注册中间件的顺序很重要。在bodyparser之前,您正在注册路由,这是不正确的。您的主体解析器和其他中间件必须在routes/API之前注册
见下文:
/*%%%%% express setup %%%%%%**/
var app = express();
/*%%%%% express setup %%%%%%**/
/*%%%%% view engine setup %%%%%%**/
app.set('views', path.join(__dirname, 'client/views'));
app.set('view engine', 'jade');
/*%%%%% view engine setup %%%%%%**/
// uncomment after placing your favicon in /public
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
// ***Register the API AFTER the body and cookie parser**
/*%%%%% client side directories %%%%%%**/
app.use(express.static('client'));
app.use(express.static('client/views'));
app.use('/js', express.static(__dirname + '/client/js'));
app.use('/js', express.static(__dirname + '/client/views/js'));
app.use('/css', express.static(__dirname + '/client/views/css'));
/*%%%%% rest api's %%%%%%**/
app.get('/api/listings', listController.list);
app.post('/api/listings', listController.create);
/*%%%%% rest api's %%%%%%**/
app.use('/', index);
app.use('/users', users);
app.use('/sell', sell);
首先,感谢@Yuri Zarubin提供的帮助。我试过你的改正,但结果还是一样。(创建->_id:ObjectId(“55e5bd389855141c195033d7”),_v:0)。如果我在list-controller.js中的服务器端填充了一些数据,它就会持续存在。我不知道为什么客户端资源上的post没有将数据发送到服务器控制器。没有错误。只需推送一条对象id为且无数据(标题和副标题)的空白记录。在list-controller.js上做了一个console.log并给了我(服务器端列表控制器***创建***调用….列表对象:{u id:55e5bdb09855141c195033d8}标题:未定义字幕:未定义)但是,对资源的get请求返回了来自db的数据和我的原始代码。看起来您的问题是发送到服务器的值不正确。我已经编辑了我的答案,试试看。尝试
console.log(req.body)
并发布结果。也尝试了同样的结果。(服务器端列表控制器***创建***调用….请求主体:未定义的列表对象:{uID:55e5c4af57e379b81a571f15}标题:未定义的字幕:未定义)。只需添加客户端$scope.listing包含表单中的标题和副标题数据。