Dateiobjekt leer beim Senden an den Server ng-Datei-Upload

Question

Ich verwende ng-Datei-Upload, um eine einfache einzelne Datei auf meinen Server hochzuladen.

Ich kann die Datei auswählen, den von mir ausgewählten Dateinamen sehen und das Dateiobjekt ($scope.myFiles[0]) an meinen eckigen Dienst übergeben. Wenn Sie jedoch meine HTTP-Dateneigenschaft mit der Datei füllen und die HTTP-Anforderung in den Entwicklungstools überprüfen, ist die Datei ein leeres Objekt.

Controller:

UploadService.upload({ data: { file: $scope.myFiles[0], 'category': $scope.selectedCategory}}) 
    .success(function (data) { 
    //// 
    //// 

UploadService:

app.factory('UploadService', function ($http, $q) { 
    return { 
     upload: function (something) { 
      console.log(something); 

      return $http({ 
       method: 'POST', 
       url: '/upload', 
       data: something 
      }); 
     } 
    } 
}); 

Mit dem oben, in dev Tools HTTP-Anfragen Inspektion, ich sehe:

Request Payload: 
    {data: {file: {}, category: "Friend Card"}} 
    data: 
     {file: {}, category: "Friend Card"} 
     category:"Friend Card" 
     file:{} 

am Ausgang der Konsole sucht. Log (etwas), ich kann die Datei sehen über:

{ 
    $hashKey:"object:107" 
    lastModified:1465716430000 
    lastModifiedDate:Sun Jun 12 2016 08:27:10 GMT+0100 (BST) 
    name:"Postcard.JPG" 
    size:522622 
    type:"image/jpeg" 
    webkitRelativePath:"" 
} 

---

Haben Funktion geändert über einen Kopftyp zu haben:

return $http({ 
      method: 'POST', 
      url: '/upload', 
      headers: { 
       'Content-Type': something.data.file.type 
      }, 
      data: { 
       "file": something.data.file, 
       "category": something.data.category 
      } 
     }); 

ich in dev Tools sehen:

Accept:application/json, text/plain, */* 
Accept-Encoding:gzip, deflate 
Accept-Language:en-US,en;q=0.8 
Connection:keep-alive 
Content-Length:48 
Content-Type:image/jpeg 
Cookie:_ga=GA1.1.2023678669.1463291637; _gat=1 
Host:localhost:8585 
Origin:http://localhost:8585 
Referer:http://localhost:8585/pages/ 

Im Einzelnen: Content-Type: image/jpeg, so dass es sieht korrekt aus, jedoch ist die Datei still und leeres Objekt.

Answer 1

Antwort kam zum Teil aus danial oben ...

Der ng-Datei-Upload-lib wird mit einer Reihe von APIs und Methoden, die sie in Ihrem Winkel App injiziert werden können, von denen eine Service ‚Hochladen‘ ist .

ich injiziert dies in meinem Controller und folgte dem jsFiddle hier: http://jsfiddle.net/danialfarid/maqbzv15/1118/

Upload.upload({ 
    url: 'https://angular-file-upload-cors-srv.appspot.com/upload', 
    data: {username: $scope.username, file: file}, 
});