Angular 7 this.imageUploader.onCompleteItem not working #1086

New Issue

2019-04-17T22:38:30Z

shahzadthathal commented

2019-04-17 22:38:30 +00:00

(Migrated from github.com)

I'm trying to upload an image but nothing working here;

 <div class="upload_photo">
                  <ul>
                    <li *ngFor="let item of imageUploader.queue">
                      <img [src]="getImageSanitizer(item)" alt="img"/>
                    </li>
                    <li (click)="fileInput.click()" style="cursor: pointer;">
                      <img src="./../../../../assets/icons/camera-icon.png" alt="img"/>
                      <span style="visibility: hidden; position: absolute; overflow: hidden; width: 0px; height:0px;border:none;margin:0; padding:0">
                         <input name="file" type="file" #fileInput ng2FileSelect [uploader]="imageUploader" />
                      </span>
                    </li>
                  </ul>
                </div>

<button  class="next_btn" (click)="create()"> Create Record </button>

ts.

import { FileUploader, FileSelectDirective  } from 'ng2-file-upload';
...
 public imageUploader: FileUploader = new FileUploader({url: environment.UPLOAD_HOST, allowedMimeType: [ 'image/jpeg'], itemAlias: 'file'});
  public softwareUploader: FileUploader = new FileUploader({url: environment.UPLOAD_HOST, itemAlias: 'file'});

  constructor() { }

ngOnInit() {

    this.imageUploader.onAfterAddingFile = (file) => { file.withCredentials = false; };
    this.imageUploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => {
         console.log('FileUpload:uploaded:', item, status, response);
         alert('File uploaded successfully');
     };

I'm trying to upload an image but nothing working here; ``` <div class="upload_photo"> <ul> <li *ngFor="let item of imageUploader.queue"> <img [src]="getImageSanitizer(item)" alt="img"/> </li> <li (click)="fileInput.click()" style="cursor: pointer;"> <img src="./../../../../assets/icons/camera-icon.png" alt="img"/> <span style="visibility: hidden; position: absolute; overflow: hidden; width: 0px; height:0px;border:none;margin:0; padding:0"> <input name="file" type="file" #fileInput ng2FileSelect [uploader]="imageUploader" /> </span> </li> </ul> </div> <button class="next_btn" (click)="create()"> Create Record </button> ``` ts. ``` import { FileUploader, FileSelectDirective } from 'ng2-file-upload'; ... public imageUploader: FileUploader = new FileUploader({url: environment.UPLOAD_HOST, allowedMimeType: [ 'image/jpeg'], itemAlias: 'file'}); public softwareUploader: FileUploader = new FileUploader({url: environment.UPLOAD_HOST, itemAlias: 'file'}); constructor() { } ngOnInit() { this.imageUploader.onAfterAddingFile = (file) => { file.withCredentials = false; }; this.imageUploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => { console.log('FileUpload:uploaded:', item, status, response); alert('File uploaded successfully'); }; ````

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: dc/ng2-file-upload#1086