index.html should be in public folder in the same directory with app.js.
-
-
Save Fashaun/fe9b0f5bb296a93df3ab1130810540d1 to your computer and use it in GitHub Desktop.
ng-file-upload example with NodeJS
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| var express = require('express'), | |
| path = require('path'), | |
| multiparty = require('connect-multiparty'), | |
| multipartyMiddleware = multiparty(), | |
| PORT = process.env.PORT || 27372; | |
| var app = express(); | |
| app.use(express.static(path.join(__dirname, 'public'))); | |
| app.post('/api/upload', multipartyMiddleware, function(req, res) { | |
| var file = req.files.file; | |
| console.log(file.name); | |
| console.log(file.type); | |
| console.log(file.path); | |
| }); | |
| var server = app.listen(PORT, function() { | |
| var host = server.address().address; | |
| var port = server.address().port; | |
| console.log('the App listening at http://%s:%s', host, port); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head lang="en"> | |
| <meta charset="UTF-8"> | |
| <title>Upload example</title> | |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <div> | |
| <h1>Upload example</h1> | |
| <hr /> | |
| <div ng-app="fileUpload" ng-controller="MyCtrl"> | |
| <button type="button" class="btn btn-default" ngf-select ng-model="file">Upload using model $watch</button> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script> | |
| <script src="http://rawgit.com/danialfarid/ng-file-upload/master/dist/ng-file-upload.min.js"></script> | |
| <script> | |
| var app = angular.module('fileUpload', ['ngFileUpload']); | |
| app.controller('MyCtrl', ['$scope', 'Upload', function($scope, Upload) { | |
| $scope.$watch('file', function() { | |
| var file = $scope.file; | |
| if (!file) { | |
| return; | |
| } | |
| Upload.upload({ | |
| url: 'api/upload', | |
| file: file | |
| }).progress(function(evt) { | |
| var progressPercentage = parseInt(100.0 * evt.loaded / evt.total); | |
| console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name); | |
| }).success(function(data, status, headers, config) { | |
| console.log('file ' + config.file.name + 'uploaded. Response: ' + data); | |
| }).error(function(data, status, headers, config) { | |
| console.log('error status: ' + status); | |
| }) | |
| });; | |
| }]); | |
| </script> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment