Fix support of custom HTTP headers

nishantmc · Apr 2, 2018 · 1d6cde9 · 1d6cde9
1 parent dc6beb6
commit 1d6cde9
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 14 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "angular-material-fileupload",
-  "version": "0.0.8",
+  "version": "0.0.10",
   "description": "A fileupload component based on angular-material design",
   "repository" :
   { "type" : "git"
@@ -15,17 +15,17 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@angular/animations": "~5.1.2",
-    "@angular/common": "~5.1.2",
-    "@angular/compiler": "~5.1.2",
-    "@angular/core": "~5.1.2",
-    "@angular/forms": "~5.1.2",
+    "@angular/animations": ">=5.1.0",
+    "@angular/common": ">=5.1.0",
+    "@angular/compiler": ">=5.1.0",
+    "@angular/core": ">=5.1.0",
+    "@angular/forms": ">=5.1.0",
 
-    "@angular/platform-browser": "~5.1.2",
-    "@angular/platform-browser-dynamic": "~5.1.2",
+    "@angular/platform-browser": ">=5.1.0",
+    "@angular/platform-browser-dynamic": ">=5.1.0",
 
-    "@angular/cdk": "^5.1.0",
-    "@angular/material": "^5.1.0",
+    "@angular/cdk": ">=5.1.0",
+    "@angular/material": ">=5.1.0",
 
     "core-js": "^2.4.1",
     "rxjs": "^5.5.0",

diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -40,7 +40,10 @@ <h1>Simple Example</h1>
 <div style="width: 500px">
     <mat-file-upload-queue #fileUploadQueue
         [fileAlias]="'file'"
-        [httpUrl]="'http://localhost:8180/jax-rs-jersey-application-sample'" multiple>
+        [httpUrl]="'http://localhost:8180/jax-rs-jersey-application-sample'"
+        [httpRequestHeaders]="httpRequestHeaders"
+        [httpRequestParams]="httpRequestParams"
+        multiple>
 
         <mat-file-upload [file]="file" [id]="i" *ngFor="let file of fileUploadQueue.files; let i = index"></mat-file-upload>
     </mat-file-upload-queue>

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
@@ -1,4 +1,6 @@
-import { Component } from '@angular/core';
+import { Input, Component } from '@angular/core';
+import { HttpClient, HttpEventType, HttpHeaders, HttpParams } from '@angular/common/http';
+
 
 import '../assets/css/styles.css';
 
@@ -9,6 +11,16 @@ import '../assets/css/styles.css';
 })
 export class AppComponent {
 
+  @Input()
+  httpRequestHeaders: HttpHeaders | {
+    [header: string]: string | string[];
+  } = new HttpHeaders().set("sampleHeader", "headerValue").set("sampleHeader1", "headerValue1");
+
+  @Input()
+  httpRequestParams: HttpParams | {
+    [param: string]: string | string[];
+  } = new HttpParams().set("sampleRequestParam", "requestValue").set("sampleRequestParam1", "requestValue1");
+
   public uploadEvent($event: any) {
     console.log('from client' + JSON.stringify($event));
   }

diff --git a/src/lib/matFileUpload/matFileUpload.component.ts b/src/lib/matFileUpload/matFileUpload.component.ts
@@ -86,7 +86,7 @@ import { MatFileUploadQueue } from '../matFileUploadQueue/matFileUploadQueue.com
       let formData = new FormData();
       formData.set(this.fileAlias, this._file, this._file.name);
       this.fileUploadSubscription = this.HttpClient.post(this.httpUrl, formData, {
-       // headers: this.httpRequestHeaders,
+        headers: this.httpRequestHeaders,
         observe: "events",
         params: this.httpRequestParams,
         reportProgress: true,
@@ -115,7 +115,7 @@ import { MatFileUploadQueue } from '../matFileUploadQueue/matFileUploadQueue.com
     }
 
     ngOnDestroy() {
-      console.log('file '+ this._file.name + ' destryed...');
+      console.log('file '+ this._file.name + ' destroyed...');
     }
 
 }