Angular2でフォーム提出でファイルをアップロードするにはどうすればよいですか？

Question

angle2でフォーム提出する方法はありますか？私はng2ファイルアップロードライブラリを使いたいです。しかし、フォーム提出でそれを使用することはできません。誰も私を助けることができますか？

Answer 1

submitで呼び出すことができるメソッドでアップロードされたファイルを渡すだけで可能です。 beckendする送信するとき、あなたはそれがこの

uploadFile(file){ 
let formData = new FormData(); 
formData.append('FILENAME', file); 
} 

ようFORMDATAにする必要があり - ：あなたはあなたのHTMLで

<form #sieFileUploadForm="ngForm"> 
    <input type="file" id="fileItem" 
    value="Browse..."> 

は

uploadFile(file){ 
console.log(file) 
} 

注意するTS

Answer 2

最後に私はあなたの問題を理解しています。それは、ファイルと共に送信したい追加のフォームデータであるようです。 あなたのFileUploaderを作成した後、次のコードを追加のフォームを追加することができます。

uploader: FileUploader = new FileUploader({ url: "http://localhost/upload.php" }); 

    constructor() { 
    this.uploader.onBuildItemForm = (item, form) => { 
     form.append("key1", "value1"); 
     form.append("key1", "value2"); 
    }; 
} 

いくつかは、それがngOnInit()にこのコードを入れて少しきれいだと言うが、私はこのコードを膨張させたくないとこの決定はここであまり重要ではありません。

その後、Firefox Developer Toolsなどのhttp投稿のペイロードにある追加の投稿データを調べることができます。私はプロジェクトのGitHubのトラッカーにsolutionを見つけました（あなたの境界は文句を言わないと同じこと）

-----------------------------110224700718602891206418821 
Content-Disposition: form-data; name="key1" 

value1 
-----------------------------110224700718602891206418821 
Content-Disposition: form-data; name="key1" 

value2 

を：彼らは次のようになります。