javascript - Upload file angular -
i have simple form
<div ng-controller='myctrl'> <form ng-submit='submit()'> <input name="name" value="name"> <lf-ng-md-file-input lf-files='files'> </lf-ng-md-file-input> <button type='submit'> submit </form> </div>
i use html element choosing file on client side: https://github.com/shuyu/angular-material-fileinput.
how can access upload file send on server?
i'd recommend using ng-file-upload trick can this, there more documentation on site fiddle different examples
<body ng-app="fileupload" ng-controller="myctrl"> <h4>upload on file select</h4> <button type="file" ngf-select="uploadfiles($file, $invalidfiles)" accept="image/*" ngf-max-height="1000" ngf-max-size="1mb"> select file</button> <br><br> file: <div style="font:smaller">{{f.name}} {{errfile.name}} {{errfile.$error}} {{errfile.$errorparam}} <span class="progress" ng-show="f.progress >= 0"> <div style="width:{{f.progress}}%" ng-bind="f.progress + '%'"></div> </span> </div> {{errormsg}} </body>
controller:
//inject angular file upload directives , services. var app = angular.module('fileupload', ['ngfileupload']); app.controller('myctrl', ['$scope', 'upload', '$timeout', function ($scope, upload, $timeout) { $scope.uploadfiles = function(file, errfiles) { $scope.f = file; $scope.errfile = errfiles && errfiles[0]; if (file) { file.upload = upload.upload({ url: 'https://angular-file-upload-cors-srv.appspot.com/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) { file.progress = math.min(100, parseint(100.0 * evt.loaded / evt.total)); }); } } }]);
Comments
Post a Comment