你好,我有一个问题上传照片在平均堆栈由休息api。上传已经工作正常,但我有问题,在我的解决方案中如何传递上传到mongodb的文件名。这是我的上传代码和api我使用两个api的一个表单一个页面desc标题另一个上传它的好决定?还是最好用一个api页面?上传工作文件上传提交表单但在mongodb featuredImage为null。如何使用ng-file-upload将名称传递给mongodb进行上传即可使用ng-model =“pageContent.featuredImage”?
form.html
<textarea ui-tinymce="tinymceOptions" rows="15" class="form-control" type="text" ng-model="pageContent.content"></textarea>
<input type="file" ngf-select ng-model="picFile" name="file"
accept="image/*" ngf-max-size="2MB"
ngf-model-invalid="errorFile">
<input type="submit" class="btn btn-success" value="Save" ng-click="uploadPic(picFile)">
调节器
.controller('PagesAddEditCtrl',['$scope','$log','Upload','$window','$timeout', 'PagesFactory', '$routeParams', '$location', 'flashMessageService','$filter', function($scope, $log,Upload,$window,$timeout, PagesFactory, $routeParams, $location, flashMessageService, $filter) {
$scope.pageContent = {};
$scope.pageContent._id = $routeParams.id;
$scope.heading = "Add a New Page";
$scope.uploadPic = function(file) {
file.upload = Upload.upload({
url: 'http://localhost:3000/upload',
data: {file: file},
});
file.upload.then(function (response) {
$timeout(function () {
file.result = response.data;
});
}, function (response) {
if (response.status > 0)
$scope.errorMsg = response.status + ': ' + response.data;
}, function (evt) {
// Math.min is to fix IE which reports 200% sometimes
file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
});
}
$scope.savePage = function(){
PagesFactory.savePage($scope.pageContent).then(
function(){
flashMessageService.setMessage("Page Saved Successfully");
$location.path('/pages')
},
function(){
$log.error('error saving data');
}
);
};
}]);
API
router.post('/pages/add', function(req,res){
var page = new Page({
title:req.body.title,
url:req.body.url,
content:req.body.content,
menuIndex: req.body.menuIndex,
featuredImage: req.body.featuredImage,
date:new Date(Date.now())
});
page.save(function(err){
if(!err){
return res.send(200, page);
}else{
return res.send(500, err);
}
});
});
page.model.js
var mongoose = require('mongoose');
var Schema = mongoose.Schema;
var Page = new Schema({
title: String,
url: {type:String, index:{unique:true}},
content: String,
menuIndex: Number,
featuredImage: String,
date: Date
});
var Page = mongoose.model('Page', Page);
module.exports=Page;
节点服务器
var storage = multer.diskStorage({ //multers disk storage settings
destination: function (req, file, cb) {
cb(null, '../uploads/')
},
filename: function (req, file, cb) {
var datetimestamp = Date.now();
cb(null, file.originalname)
}
});
var upload = multer({ //multer settings
storage: storage
}).single('file');
/** API path that will upload the files */
app.post('/upload', function(req, res) {
upload(req,res,function(err){
console.log('test');
if(err){
res.json({error_code:1,err_desc:err});
return;
}
res.json({error_code:0,err_desc:null});
});
});
将名称作为form/multipart
中的单独部分发送:
$scope.uploadPic = function(file) {
file.upload = Upload.upload({
url: 'http://localhost:3000/upload',
data: {file: file,
name: file.name},
});
有关文件属性的更多信息,请参阅MDN JavaScrip Web API Reference - File API。