title: Difficulty in File Upload in Angular 2 using ng2-file-upload and ng2-uploader
body: <p>I am re writing an application into Angular and have to upload a file. The network shows me status:200 but there is no response and my back end is not receiving any file. </p>
  
  <p>The Problem is .. 1. Why Request Method is OPTION ?(CORS might have something to do with this ! but i have tested on another machine where CORS is not a problem as it is on same port)</p>
  
  <p>2.How to Change the Content-Type from text/plain to multipart/form-data when using the file upload code ?</p>
  
  <ol start="3">
  <li>where do i define the headers or content-type while using the file upload code of the <a href="http://valor-software.com/ng2-file-upload/" rel="nofollow">http://valor-software.com/ng2-file-upload/</a> or <a href="http://ng2-uploader.com/docs" rel="nofollow">http://ng2-uploader.com/docs</a> code</li>
  </ol>
  
  <p>This is the Network Report from browser while using the file uploader:</p>
  
  <pre><code>Request URL:http://localhost:5000/clari5-cc/rest/1.0/installation/upload
  Request Method:OPTIONS
  Status Code:200 OK
  Remote Address:[::1]:5000
  Response Headers
  view source
  Allow:POST, OPTIONS
  Content-Type:text/plain
  Request Headers
  view source
  Accept:*/*
  Accept-Encoding:gzip, deflate, sdch
  Accept-Language:en-US,en;q=0.8
  Access-Control-Request-Headers:
  Access-Control-Request-Method:POST
  Connection:keep-alive
  Host:localhost:5000
  Origin:http://evil.com/
  Referer:http://localhost:3000/
  </code></pre>
  
  <p>But my older running application used to get this data in Network Response: I can see a notable difference. </p>
  
  <pre><code>Request URL:http://localhost:5000/try/rest/1.0/installation/upload
  Request Method:POST
  Status Code:200 OK
  Remote Address:[::1]:5000
  Response Headers
  view source
  Content-Type:application/json
  Transfer-Encoding:chunked
  Request Headers
  view source
  Accept:application/json, text/javascript, */*; q=0.01
  Accept-Encoding:gzip, deflate
  Content-Type:multipart/form-data; boundary=----        WebKitFormBoundaryB06sfkK4FgTODz0F
  Cookie:Webstorm-e27c5fb2=42da3160-45c3-490c-a5d9-b0ed07b63022
  Host:localhost:5000
  Origin:http://evil.com/
  Referer:http://localhost:5000/try/mainPage.html
  Request Payload
  ------WebKitFormBoundaryB06sfkK4FgTODz0F
  Content-Disposition: form-data; name="uploadedFiles";             filename="installer.tar"
  Content-Type: application/x-tar
  </code></pre>
  
  <p>here is the code and i do not have any clue how to make changes and there is no option provided as well no example ?
  Any help and suggestion will be appreciated, Thank you</p>
  
  <pre><code>export class AppComponent {
    public uploader:FileUploader = new FileUploader({url: "http://localhost:5000/try/rest/1.0/installation/upload"});
    public hasBaseDropZoneOver:boolean = false;
    public hasAnotherDropZoneOver:boolean = false;
  
    public fileOverBase(e:any):void {
      this.hasBaseDropZoneOver = e;
    }
  
    public fileOverAnother(e:any):void {
      this.hasAnotherDropZoneOver = e;
   }
  }  
  </code></pre>
  
  <p>or in </p>
  
  <pre><code>export class AppDemoComponent implements OnInit {
   private zone: NgZone;
   private basicOptions: Object;
   private progress: number = 0;
   private response: any = {};
  
   ngOnInit() {
     this.zone = new NgZone({ enableLongStackTrace: false });
     this.basicOptions = {
       url: 'http://api.ng2-uploader.com:10050/upload'
     };
   }
  
   handleUpload(data: any): void {
     this.zone.run(() =&gt; {
       this.response = data;
       this.progress = data.progress.percent / 100;
     });
   }
  }
  </code></pre>