Datei hochladen mit anderen Daten in angularjs mit Laravel

Question

Ich möchte Datei und andere Daten mit angularjs hochladen. Ich benutze FormData, aber ich erhalte leere Array von Server-Seite.

Das ist meine Form

<form ng-submit="beatSubmit()" name="beatform" enctype="multipart/form-data"> 
    <input type="text" id="beat-name" ng-model="beatData.title" required="required" /> 
    <input type="file" id="image" file-model="image" /> 
    <input type="file" id="tagged_file" file-model="tagged_file" accept="audio/mp3" /> 
    <input type="file" id="untagged-beat" file-model="untagged_file" accept="audio/mp3" /> 
    <input type="text" class="form-control" id="price1" ng-model="beatData.price1"> 
</form> 

Hier ist mein Controller und FileModel Richtlinie

app.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]); 
       }); 
      }); 
     } 
    }; 
    }]); 
// This is controller part in another file 
    $scope.beatSubmit = function(){ 

      var image = $scope.image; 
      var tagged_file = $scope.tagged_file; 
      var untagged_file = $scope.untagged_file; 

      var response = BEAT.uploadBeat($scope.beatData,image,tagged_file,untagged_file); 
      response.success(function(response){ 
       console.log(response); 
      }); 
     } 

Und das ist mein Service

uploadBeat:function(data,image,tagged_file,untagged_file){ 
      var fd = new FormData(); 
      fd.append('image', image); 
      fd.append('tagged_file', tagged_file); 
      fd.append('untagged_file', untagged_file); 

      angular.forEach(data, function(value, key) { 
       fd.append(key,value); 
      }); 
      console.log(fd); // fd is null , I don't know why? 
      var req = { 
         method: 'POST', 
         transformRequest: angular.identity, 
         url: 'api/upload_music', 
         data: fd, 
         headers:{ 
          'Content-Type': undefined, 
          } 
         } 
      return $http(req); 

     } 

Wenn ich versuche, diese Daten von der Serverseite zu bekommen, wird es null zurückgeben. Ich verbrachte mehr Zeit, um das zu lösen. Aber ich hatte keine Lösung. Wenn jemand weiß, bitte hilf mir. Danke im Voraus.

Answer 1

Fügen Sie diese Header Details zu den $ http

$http({ 
        method: 'POST', 
        url: '', 
        headers: { 
           'X-Requested-With': 'XMLHttpRequest', 
           'Accept':'*/*', 
           'Content-type':'application/x-www-form-urlencoded;charset=utf-8' 
          }, 
        params:data, 
        timeout:4000 
        }); 

Laravel Ajax-Anforderung nicht erlaubt, ohne Politik derselben Domäne

Answer 2

ich einen Fehler gefunden, ich muss enctype = "multi entfernen/form- einreichen Daten "aus dem Formular.