0
画像にタグを付けることができる画像データベースを作成しようとした。私はthis example hereを使っていくつかのことを修正したかったのです。 AngularとmongDBの全く新しいものMean-Multer-Mongoose-Angularでタグを更新または追加する
これは私のマングースモデルです。
var UploadSchema = mongoose.Schema({
name: String,
tags: {
ImageObjects: String,
CreatorArtist: String,
Question1: String,
Question2: String
},
created: Date,
file: Object
});私はすでに提出/ローカルに画像をアップロードする際、いくつかのタグを追加して、私のMongoDB内のタグを格納することができます。
しかし、今、私は望んでいた場合.put能力（）いくつか複数のタグを持っていると思います。 だから私はそれは私がこの部分は私が唯一 "を変更成るfileuploadExample.js から変更され、また関連していると思います。この
uploads.js
var express = require('express');
var router = express.Router();
var fs = require('fs');
var Upload = require('../models/upload');
var multer = require('multer');
var upload = multer({
dest: 'uploads/'
});
var _ = require('underscore');
/**
* Create's the file in the database
*/
router.post('/', upload.single('file'), function(req, res, next) {
var newUpload = {
name: req.body.name,
tags: req.body.tags,
created: Date.now(),
file: req.file
};
Upload.create(newUpload, function(err, next) {
if (err) {
next(err);
} else {
res.send(newUpload);
}
});
});
/**
* Gets the list of all files from the database
*/
router.get('/', function(req, res, next) {
Upload.find({}, function(err, uploads) {
if (err) next(err);
else {
res.send(uploads);
}
});
});
/**
* Change tags of one images. Maybe add some too
*/
router.put('/:uuid/:filename', function(req, res) {
Upload.findOne({
'file.filename': req.params.uuid,
'file.originalname': req.params.filename
}, function(err, upload) {
if (err) next(err);
else {
res.set({
"Content-Disposition": 'inline; filename="' + upload.file.originalname + '"',
"Content-Type": upload.file.mimetype
});
Upload = _.extend(Uploads, req.params);
Upload.save(function (err){
res.send(uploads);
})
}
});
});
/**
* Gets a file from the hard drive based on the unique ID and the filename
*/
router.get('/:uuid/:filename', function(req, res, next) {
//console.log(req.params);
Upload.findOne({
'file.filename': req.params.uuid,
'file.originalname': req.params.filename
}, function(err, upload) {
if (err) next(err);
else {
res.set({
"Content-Disposition": 'inline; filename="' + upload.file.originalname + '"',
"Content-Type": upload.file.mimetype
});
fs.createReadStream(upload.file.path).pipe(res);
}
});
});
module.exports = router;が好きなルーティング「投稿する」に「投稿する」。
var app = angular.module('fileUpload', ['ngFileUpload']);
var tempFileName, tempID;
app.controller('formCtrl', ['$http', 'Upload', '$scope', function($http, Upload, $scope) {
$http.get('/uploads').then(function(response) {
console.log(response.data);
$scope.uploads = response.data;
});
$scope.submit = function() {
Upload.upload({
url: '/uploads',
method: 'put',
data: $scope.upload
}).then(function(response) {
tempID = response.data.file.filename;
sessionStorage.setItem("tempID", tempID);
tempFileName = response.data.file.originalname;
sessionStorage.setItem("tempFileName", tempFileName);
console.log(tempID);
console.log(tempFileName);
console.log(response.data);
$scope.uploads.push(response.data);
$scope.upload = {};
})
}
}]);<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>これはHTMLです。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Test Tagging Example </title>
<link rel="stylesheet" href="/css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/jquery.steps.css">
<script src="/vendor/angular.min.js"></script>
<script src="/vendor/ng-file-upload-all.min.js"></script>
<script src="/javascripts/fileTagging.js"></script>
<script type="text/javascript" src="/vendor/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="/vendor/jquery.steps.js"></script>
<script type="text/javascript" src="/vendor/jquery-validate.js"></script>
</head>
<body ng-app="fileUpload">
<div ng-controller="formCtrl">
<div>
<img ng-src="" id="imageBox" />
<script>
var tempID = sessionStorage.getItem("tempID");
var tempFileName = sessionStorage.getItem("tempFileName");
console.log(tempID);
console.log(tempFileName);
document.getElementById('imageBox').src = "uploads/" + tempID + "/" + tempFileName;
</script>
</div>
<!-- <div id="wizard"> -->
<h2>Session tagging</h2>
<!-- <section> -->
<h1>Test Session</h1>
<form ng-submit="submit()">
<label for="q1">Question1:</label>
<input type="text" name="q1" id="q1" ng-model="upload.tags.Question1" required/>
<br/>
<input type="submit" value="Submit" />
</form>
<a href="viewAll">View All</a>
<a href="viewSingleUploaded">View Uploaded</a>
</div>
</body>
</html>それでは、どのように私は（.put使用して、既存のタグにアップロードされた画像にタグを追加/更新することができますか）？必要に応じてさらに情報を提供します。
あなたは、フルバージョンが必要な場合はそれがhere