角2のポストリクエストは画像データを送信しません

Question

フォームを使用して画像を送信しています。送信すると、データなしでリクエストが送信されます。ここに私のコード：

component.html

<form [formGroup]="logoImageForm" *ngIf="representativeSelected != null" (ngSubmit)="onSubmit(logoImageForm)"> 
    <md-grid-list cols="6" rowHeight="50"> 
     <md-grid-tile> 
      <input type="file" id="logo_image" formControlName="logo_image" name="logo_image" ngModel (change)="onChange($event)"> 
     </md-grid-tile> 
    </md-grid-list> 
    <md-card-actions> 
     <button md-raised-button color="primary" type="submit">Save</button> 
    </md-card-actions> 
</form> 

component.ts

onChange(event){ 
    this.file = event.target.files[0]; 
} 

onSubmit(logoImage){ 
this.representativeS.uploadLogoImage(this.file) 
    .subscribe(
    data => { 
    swal('', 'Image updated!', 'success'); 
    }, 
    error => { 
    swal('Error', '<p>' + error.message + '</p>', 'success'); 
    }); 
} 

代表（サービス）

uploadLogoImage(file){ 
    let url = this.routesS.getApiRoute('logoImage'); 
    console.log(file); 
    return this.http.post(url, JSON.stringify({fileData: file}),{ withCredentials: true, headers: this.headersImage }) 
    .map((response: Response) => { 
     return response.json(); 
    }) 
    .catch(this.handleError); 
} 

のNodeJS

var storage = multer.diskStorage({ 
destination: function (req, file, callback) { 
    callback(null, 'path/test'); 
}, 
filename: function (req, file, callback) { 
    callback(null, 'logo-image') 
} 
}); 

var upload = multer({ storage: storage }).single('logo-image'); 

router.route('/representatives/:id/logoImage') 
    .post((req, res, next) => { 
     upload(req, res, function (err) { 
      if (err) { 
       console.log('Error Occured'); 
       return; 
      } 
      res.end('Your File Uploaded'); 
     }) 
    }); 

私は私の要求をチェックすると、私は、提出するか、それがその{fileData: {}}ようなものを示してsendedでは。ボイドデータを送信するのはなぜですか？

Answer 1

私はあなたのファイルをどのように送信するのが問題だと思います。

別の質問では、この答えはあなたを助けるかもしれない：https://stackoverflow.com/a/35669598/5049472