AngularJsフォームファイルのアップロードを実現

一:従来のフォーム提出方式

"your url" method="post" enctype="multipart/form-data">
        type="file" name="logo">
        type="submit" value="  ">
    

二:AngularJS処理ファイルアップロード

    <div  ng-controller="UploaderController" >
        <input type="file" file-model="myFile" >
        <button ng-click="save()" >  button>
    div>

anjularjsのhttpリクエストでファイルをアップロードするので、現在のrequestをMultipart/form-dataリクエストにするには、anjularjsがpostとgetリクエストに対してデフォルトのContent-Type headerがアプリケーション/jsonです.「Content-Type」:undefinedを設定すると、ブラウザはContent-Typeをmultipart/form-dataに設定するだけでなく、現在のboundaryにも入力します.手動で「Content-Type」:multipart/form-dataに設定すると、バックグラウンドに異常が放出されます.the current request boundary parameter is null.transformRequest:angular.Identity,anjularjs transformRequest functionは私たちのformdata objectをシーケンス化します.

$scope.save = function() {    
    var fd = new FormData();
    var file = document.querySelector('input[type=file]').files[0];
    fd.append('logo', file); 
     $http({
          method:'POST',
          url:"your url",
          data: fd,
          headers: {'Content-Type':undefined},
          transformRequest: angular.identity 
           })   
          .success( function ( response )
                   {
                   //       
                   alert("uplaod success");
                   }); 

 }
});

  ：   file        ：var file = $scope.myFile.      js  data: fd,            ：params：{ fd，…}

公式解釈は

params – {Object.<string|Object>} – Map of strings or objects which will be serialized with theparamSerializer and appended as GET parameters.
    data – {string|Object} – Data to be sent as the request message data.

 GET       params ， POST/PUT/PATCH/DELETE     params      ，   data   。