ng2-file-upload single upload override file upload

5.6k Views Asked by At

I do the demo base on this tutorial: https://github.com/valor-software/ng2-file-upload. I want to single file upload but without remove file button. By adding the File A, after that I add the File B. File A will be replaced by file B. here is my uploader:

 this.uploader = new FileUploader(
      {
        url: this.baseURL,
        allowedFileType: ["xls"],
        maxFileSize: 5,
        queueLimit: 1
      });

Please advice me

3

There are 3 best solutions below

0
Arun Muthiyarkath On

Probably you can use onAfterAddingFile callback of the library provided function. Below is the sample code. This is always override old file with latest file and queue will always contain one item which is the latest file.

  ngOnInit() {

     this.uploader.onAfterAddingFile = (fileItem: FileItem) => this.onAfterAddingFile(fileItem)

}

onAfterAddingFile(fileItem: FileItem) {
   let latestFile = this.uploader.queue[this.uploader.queue.length-1]
   this.uploader.queue = []; 
   this.uploader.queue.push(latestFile);
} 
0
Rijaz Ali On

As Arun Muthiyarkath suggested, you can use the onAfterAddingFile, but the shorter code would be:

  ngOnInit() {
    this.uploader.onAfterAddingFile = (fileItem: FileItem) => {
      if (this.uploader.queue.length > 1) {
        this.uploader.removeFromQueue(this.uploader.queue[0]);
      }
    };
  }

Source: https://github.com/valor-software/ng2-file-upload/issues/703

1
hanan On
this.uploader.onAfterAddingFile = (fileItem: FileItem) => {
  if (this.uploader.queue.length > 0) {
    this.uploader.queue = [fileItem];
  }
};