Thursday, 11 May 2017

AngularJS: FileUpload and Save path in database

I am a newbie of angularjs. My version is 1.6.4 using with nodeJS. I am following this tutorial for file upload leon/angular-upload. I did all the steps written here to make it work which are.

1) bower install --save angular-upload

2) Add module dependency "lr.upload" which i did

angular.module(__appName, ["ngMap", "multipleSelect", "lr.upload"]);

3) Add this code snippet in html page, so i did in my fileuploadTest.html.

<div class="btn btn-primary btn-upload"
         upload-button
         url="/upload"
         on-success="onSuccess(response)"
         on-error="onError(response)">Upload</div>

4) And finally add script to html page.

<script src='bower_components/angular-upload/angular-upload.min.js'></script>

My server.js is code is:

var express = require("express");
var multer = require('multer')
var upload = multer({ dest: 'app/upload' })
var app = express();

app.use(express.static(__dirname + '/app'));
app.use('/bower_components',  express.static(__dirname + '/bower_components'));

app.get("/", function(req, res){
    res.redirect("app/index.html");
});

app.listen(3000, function(){
    console.log("Tellworld web app listening on port 3000");
})

app.post('/upload', upload.any(), function (req, res, next) {
    //filename of a file
    console.log(req.files[0].filename);
    res.send(req.files);
})

Everything is working fine so far, file is uploading, but now i have to save filename in a database. I need some way to pass filename (The name of the file within the destination | disk storage) of a file not its orignalName (Name of the file on the user's computer) to my html form, so that i can save it there with rest of form fields like name, age, profile_pic and etc.



via MTA

No comments:

Post a Comment