ng-fileアップロードで他のデータと一緒にファイルが送信されない

Question

ng-fileモジュールとlaravelバックエンドとともにangs jsフロントエンドを使用しています。何らかの理由でfileuploadが他のフォームデータと共にファイルを送信しません： ここに私の形式は次のとおりです。

<form method="post" name="myForm"> 


     <div class="form-group has-feedback"> 
      <input type="file" ngf-select ng-model="picFile" name="file"  
     accept="image/*" ngf-max-size="2MB" required 
     ngf-model-invalid="errorFile"> 

    <i ng-show="myForm.file.$error.required">*required</i><br> 
    <i ng-show="myForm.file.$error.maxSize">File too large 
     {{errorFile.size/1000000|number:1}}MB: max 2M</i> 
    <img ng-show="myForm.file.$valid" ngf-thumbnail="picFile" class="thumb"> <button ng-click="picFile = null" ng-show="picFile">Remove</button> 
     </div> 

     <div class="form-group has-feedback"> 
     <input class="form-control input-lg" id="username" type="text" name="username" ng-model="user.username" placeholder="Name" 
     required 
     ng-minlength="6" 
     autofocus> 

     </div> 

     <div class="form-group has-feedback"> 
     <input class="form-control input-lg" type="email" id="email" name="email" ng-model="user.email" placeholder="Email" required> 
     </div> 

     <div class="form-group has-feedback"> 
     <input class="form-control input-lg" type="text" id="firstname" name="firstname" ng-model="user.firstname" placeholder="First Name"> 
     </div> 

     <div class="form-group has-feedback"> 
     <input class="form-control input-lg" type="text" id="lastname" name="lastname" ng-model="user.lastname" placeholder="Last Name"> 
     </div> 


     <button type="submit" class="btn btn-lg btn-block btn-primary" ng-disabled="!myForm.$valid" ng-click="updateProfile(picFile)" >Update</button> 

     <span class="progress" ng-show="picFile.progress >= 0"> 
    <div style="width:{{picFile.progress}}%" 
     ng-bind="picFile.progress + '%'"></div> 
    </span> 
    <span ng-show="picFile.result">Upload Successful</span> 
    <span class="err" ng-show="errorMsg">{{errorMsg}}</span> 

     {{picFile}} 
    </form> 

、ここでは私のコントローラです：

$scope.getProfile = function() { 
    Account.getProfile() 
    .then(function(response) { 

     $scope.user = response.data; 

    }) 
    .catch(function(response) { 
     toastr.error(response.data.message, response.status); 
    }); 
}; 

$scope.updateProfile = function(file) { 
file.upload = Upload.upload({ 
    url: '/kilo/api/me', 
    data: {username: $scope.user.username, file: file }, 
method:"POST" 
}); 

file.upload.then(function (response) { 
    $timeout(function() { 
    file.result = response.data.message; 
    console.log(file.result); 
    }); 
}, function (response) { 
    if (response.status > 0) 
    $scope.errorMsg = response.status + ': ' + response.data; 
}, function (evt) { 
    // Math.min is to fix IE which reports 200% sometimes 
    file.progress = Math.min(100, parseInt(100.0 * evt.loaded/evt.total)); 
}); 
}; 

上記は、「ユーザー名」を送信し、ファイルを残します。誰でも間違っていることを私に見せてもらえますか？

Answer 1

アップロードオブジェクトにarrayKey: '', headers: { 'Content-Type': undefined },を追加します。