How to submit form which contain in Angular 2

Question

media.html

<form #form="ngForm" (ngSubmit)="uploadFile(form.value)">
  <input type="file" ngControl="inputFile" />
  <input type="text" ngControl="name"/>
  <button type="submit" >Upload</button>
</form>

media.ts

uploadFile(fileUpload){
    console.log(fileUpload); // this 
    this.mediaService.addMedia(fileUpload).subscribe((r)=> {
        console.log(r);
      },
      (error) => {
        console.log(error.text());
      }
    );
  }

in line : console.log("fileUpload"); . It print out that :

inputFile:null

name: "asdasdasdasd"

this mean that I can't catch value of to submit on my server . how to catch it ? thanks for help !

Looks like a dup of http://stackoverflow.com/questions/36383297/angular-2-model-driven-form-with-input-file-file-upload or http://stackoverflow.com/questions/35399617/angular-2-file-upload-from-input-type-file — Günter Zöchbauer, Jun 16 '16 at 04:50
You should use multipart request which is the only way to send input type file — mayur, Jun 16 '16 at 05:02

score 2 · Answer 1 · edited Jun 16 '16 at 05:46

2

hi in order to send file through form tag you must have attribute

ENCTYPE = "multipart/form-data"

in form tag

which in turn help you in uploading file

edited Jun 16 '16 at 05:46

Günter Zöchbauer

623,577
216
2,003
1,567

answered Jun 16 '16 at 05:46

Veeresh123

87
16

So how does this help one submit the file data? This is using angular 2+, the form doesn't submit normally. – Tiedye Oct 16 '17 at 16:33

How to submit form which contain in Angular 2

1 Answers1