angularjs - upload a file using angular, express and mongodb's gridfs -
i new these technologies , hence have limited knowledge on how upload file. during research, have seen ngupload , other javascript/directive based solutions. however, trying following , not sure else missing complete it.
i trying upload file after creating blog using angular-express-blog application. have following code
in view.jade
fieldset h5 add media form(name='theform', enctype="multipart/form-data") .clearfix label document name .input: input(ng-model='form.docname', name='docname', type='text') .clearfix label file .input: input(ng-model='form.file', type="file", name="file") .actions button(ng-click="uploadfiles('/page3files')") upload files the controller, need return uploadfile page hence, passing in /page3files.
$scope.uploadfiles = function( path ) { //alert("upload files clikced"); $http.post('/api/uploadfile', $scope.form). success(function(data) { $scope.form.docname=''; $scope.form.file=''; $location.path(path); }); }; in express routes file
exports.uploadfile = function (req, res) { console.log("doc name: " + req.body.docname); console.log("file name: " + req.body.file.name); console.log("file path: " + req.body.file.path); res.json(true); }; unfortunately, getting exception @ req.body.file.name saying cannot read property 'name' of undefined.
any assistance appreciated.
thanks, melroy
for $http.post() able upload files need set configurations. headers : {'content-type': undefined}, transformrequest: angular.identity
you can use simple/lightweight angular-file-upload directive takes care of you. supports drag&drop, file progress , file upload non-html5 browsers fileapi flash shim.
<div ng-controller="myctrl"> <input type="file" ng-file-select="onfileselect($files)" multiple> </div> js:
//inject angular file upload directive. angular.module('myapp', ['angularfileupload']); var myctrl = [ '$scope', '$upload', function($scope, $upload) { $scope.onfileselect = function($files) { //$files: array of files selected, each file has name, size, , type. (var = 0; < $files.length; i++) { var $file = $files[i]; $upload.upload({ url: 'my/upload/url', file: $file, progress: function(e){} }).then(function(data, status, headers, config) { // file uploaded console.log(data); }); } } }];
Comments
Post a Comment