2017-12-19 10 views
0

ファイル4をファイルにアップロードし、var_dumb()を使用してファイルオブジェクトを空にすると、テキストのような別のデータでphpに送信しようとしています。ファイルを角4でアップロードしてphpファイルに渡します

マイpost.component.html

<a class="upload-photo-item"> 
      <input type="file" class="Upload-photo" accept="image/*" ngf-max-size="2MB" (change)="handleInputChange($event)"/> 
      <i class="fa fa-tags olymp-computer-icon" aria-hidden="true"></i> 

      <h6>Upload Photo</h6> 
      <span>Browse your computer.</span> 
     </a> 

そして、これがhandleInputChange関数です。今まで

post = new PostObject(); 
    image: File; 

handleInputChange(event) { 
     console.log(event); 
     this.image = event.target.files[0]; 

     var pattern = /image-*/; 

     if (!this.image.type.match(pattern)) { 
      console.log('File is not an image'); 
      return; 
     } 
     this.post.postPhoto = this.image; 

     console.log('image :' + this.image); 
    } 

すべてが完璧で、私は今ここに、コンソールでの私のオブジェクトファイルを見ることができるが、問題です:

My post.php

$data = json_decode(file_get_contents('php://input'), true); 
var_dump($data); 
exit; 

このような配列(0)とAPIレスポンス: enter image description here

それはbase64によって解決することができるが、これは私のためのオプションではありません、任意のアイデアしてください?

+0

あなたはAJAXの方法で、サーバーにそれらのファイルを送信するためにFORMDATAを使用して、$ _FILESと非ファイルデータのための$ _POSTを使用して受信することができ –

+0

@RoweldeGuzman私は試みましたが、私は別の方法があると確信しています、あなたの方法はAngularJSで可能です、私は角度4を使用しています。 –

答えて

0

希望これは角度2+でFORMDATAを送信する方法、役立ちます:

import {HttpClient, HttpHeaders} from '@angular/common/http'; 
    ... 
    constructor(private http: HttpClient) {} 
    ... 
    test() { 
      const formData = new FormData(); 
      formData.append('data', JSON.stringify({ 
       test: 'test' 
      })); 
      formData.append('file', file); 

      const headers = new HttpHeaders().set('Content-Type', []); 

      // responseType 'text' is necessary for IE 
      return this.http.post(url, formData, { 
       headers, 
       responseType: 'text' 
      }); 
    } 
関連する問題