Hello Below is the code that I am using and it throws an error :
<!DOCTYPE html>
<html>
 <head>
 <title>AngularJS File Upoad Example with $http and FormData</title>
 <script src="Scripts/jquery.js"></script>
 <script src="http://xxxxxxxxxxx/angular.min.js"  type="text/javascript"></script>
<script>
    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 () {
                alert("success");
            })
            .error(function () {
                alert("error");
            });
        }
    }]);
    myApp.controller('myCtrl', ['$scope', 'fileUpload', function ($scope, fileUpload) {
        $scope.uploadFile = function () {
            var file = $scope.myFile;
            alert(file);
            var uploadUrl = "http://xxxxx/listdata.svc/Documents(2)";//linke to the sharepoint document library with item id 2
            fileUpload.uploadFileToUrl(file, uploadUrl);
        };
    }]);
upload me
