formDataをangleからlaravle 5.3に渡すにはどうすればconatinファイルをアップロードするのですか？

Question

私はこのフォームをlaravelのブレードファイルに入れました。

<form class="form-horizontal" ng-submit="onSubmit()" method="POST" id='products'enctype="multipart/form-data" novalidate="novalidate"> 

    <input type="hidden" name="_token" value="IPcUrZpuTnJQE22gFYCuD9bWMz5q90eCVvrlmtY4"> 

     <div class="form-group" ng-class=""> 

      <label class="col-md-2 control-label ">Product Name</label> 

      <div class="col-md-10"> 

       <input class="form-control" 
         name="prod_name" 
         size ="" 
         ng-model='myMoudle.prod_name' 
         maxlength="" 
         type="text" 
         required="required" 
         value=""> 

      </div> 

     </div> 

     <div class="form-group" ng-class=""> 

      <label class="col-md-2 control-label ">Picture</label> 

      <div class="col-md-10"> 

       <input class="form-control " 
         name="prod_pic" 
         ng-model='myMoudle.prod_pic' 
         type="file" 
         file-input="files" 
         value=""> 

      </div> 

     </div> 

     <div class="form-group" ng-class=""> 

      <label class="col-md-2 control-label ">Price</label> 

      <div class="col-md-10"> 

       <input class="form-control " 
         name="prod_price" 
         ng-model='myMoudle.prod_price' 
         type="number" 
         value=""> 
      </div> 

     </div> 

    <button type="submit" class="btn btn-info btn-sm pull-left"><i class="fa fa-plus"></i></button> 

</form> 

私のJSコード：

app = angular.module('myMoudle', []); 

app.controller('myController', function ($scope, $http) { 

$scope.names = []; 

$scope.onSubmit = function() { 

    var fd = new FormData(); 

    $http({ 
     method: 'POST', 
     url: 'CreateProducts', 
     headers: { 
      "Content-Type": undefined 
     }, 
     data: fd 

    }) 

    .success(function (response) { 
     $scope.names = response; 
    }) 

    .error(function (response) { 
     console.log(response); 
    }); 
} 
}); 

と私のPHPのコントローラ機能は、次のようになります。

public function postCreateProducts(Request $request) { 

    print_R($_FILES) ; 

    echo $request->input('prod_name'); 

    $posts = Input::all(); 
    print_R($posts) ; 

} 

すべてのことが示されているは、Array（）は、Array（）です。そして私がフォームで送るものではありません。 私はいくつかの助けを得ることを非常にうれしく思うでしょう。

Answer 1

これは私のために働いています。同様にhttpを変更する必要があります。また、ファイルの入力を忘れずに入力してください。

   $http({ 
       method: 'POST', 
       url: '/api/v1/photos', 
       headers: { 
        'Content-Type': undefined 
       }, 
       data: {     
        name: $scope.name,     
        file: $scope.file, 
       }, 
       transformRequest: function (data, headersGetter) { 
        var formData = new FormData(); 
        angular.forEach(data, function (value, key) { 
         formData.append(key, value); 
        }); 
        return formData; 
       } 
      }) 
       .success(function (response) { 
        Notification('OK'); 
       }) 
       .error(function (data, status) { 
        vm.errors = data; 
       }); 

ディレクティブ追加：

<input id="photo_uploader" type="file" file="file" name="file"/> 

そして、あなたのコントローラ内で使用すると、バリデーション定義：

public function store(CreatePhotoAPIRequest $request) 
{ 
    $input = $request->all(); 

    $file = $request->file('file'); 
//validation etc...