Angularjs File Upload

Reference: Http://jsfiddle.net/JeJenny/ZG9re/

<div Ng-controller = "Myctrl" >

<input type= "File" file-model= "MyFile"/>

<button ng-click= "UploadFile ()" >upload me</button>

</div>

var MyApp = angular.module (' myApp ', []);

Myapp.directive (' Filemodel ', [' $parse ', function ($parse) {

return {

Restrict: ' A ',

Link:function (scope, element, Attrs) {

var model = $parse (Attrs.filemodel);

var modelsetter = model.assign;

Element.bind (' Change ', function () {

Scope. $apply (function () {

Modelsetter (scope, element[0].files[0]);

});

});

}

};

}]);

Myapp.service (' FileUpload ', [' $http ', function ($http) {

This.uploadfiletourl = function (file, uploadurl) {

var fd = new FormData ();

Fd.append (' file ', file);

$http. Post (Uploadurl, FD, {

TransformRequest:angular.identity,

Headers: {' Content-type ': undefined}

})

. Success (function () {

})

. Error (function () {

});

}

}]);

Myapp.controller (' Myctrl ', [' $scope ', ' fileUpload ', function ($scope, fileUpload) {

$scope. UploadFile = function () {

var file = $scope. myFile;

Console.log (' file is ');

Console.dir (file);

var uploadurl = "/fileupload";

Fileupload.uploadfiletourl (file, uploadurl);

};

}]);

Angularjs File Upload