3.3.x version not working EventEmitter<UploadInput>

[leo6104]

Same code works with ngx-uploader 3.2.3 but not working in 3.3.1.

Our project's file upload code.

onUploadOutput(output: UploadOutput): void {
        console.log(output); // lets output to see what's going on in the console

        if (output.type === 'addedToQueue') {
            if (output.file.size > this.sizeLimit) {
                this.snackBar.open("Too large size!", null, {
                    duration: 3000
                });
                return;
            } else {
                this.paperFileIDs.push({
                    status: 'uploading',
                    id: output.file.id,
                    file_name: output.file.name,
                    progress: output.file.progress,
                    file_id: null
                });
                const event: UploadInput = {
                    type: 'uploadFile',
                    url: `${base_api_url}/file/tmp?type=paper`,
                    method: 'POST',
                    file: output.file,
                    headers: {
                        Authorization: localStorage.getItem('token')
                    },
                    concurrency: 1 // set sequential uploading of files with concurrency 1
                };
                this.uploadInput.emit(event);
            }
        } else if (output.type === 'uploading') {
            // update current data in files array for uploading file
            const index = this.paperFileIDs.findIndex(file => file.id === output.file.id);
            if (index != -1) {
                this.paperFileIDs[index].progress = output.file.progress.data.percentage;
            }

        } else if (output.type === 'done') {
            if (output.file.response && output.file.response.file_id) {
                const index = this.paperFileIDs.findIndex(file => file.id === output.file.id);
                this.paperFileIDs[index].status = 'success';
                this.paperFileIDs[index].file_id = output.file.response.file_id;
            } else {
                this.snackBar.open('Server is not working.', undefined, {
                    duration: 3000
                });
                this.paperFileIDs = this.paperFileIDs.filter(row => row.id != output.file.id);
            }

        } else if (output.type === 'removed') {
            // remove file from array when removed
            this.paperFileIDs = this.paperFileIDs.filter(row => row.id != output.file.id);
        }
    }

Above code follow example code.

[leo6104]

I found the root cause. https://github.com/jkuri/ngx-uploader/blob/bcd90920fae5c1262eab189a51efcc6b57c3bf23/src/ngx-uploader/classes/ngx-uploader.class.ts#L216 XMLHttpRequest.DONE is not 4. it is function.

[jkuri]

in which browser you are getting this?

[leo6104]

It is happened in Chrome browser

[jkuri]

this is interesting. XMLHttpRequest.DONE represents integer of 4. try outputing console.log(XMLHttpRequest.DONE);. also, I am not getting any errors because of this. if you can get me steps to reproduce it would be helpful. thanks.

[keliwath]

I'm having the same issue - works fine with 3.2.3, breaks with 3.3.x. The component generates an UploadOutput correctly but when the event is emitted nothing happens. No errors, nothing.

The code I have is very simple:

<input ngFileSelect (uploadOutput)="onUploadOutput($event)" [uploadInput]="uploadInput" class="inputfile" type="file" />

and then

onUploadOutput(output: UploadOutput): void {
    if (output.type === 'addedToQueue') {
          const event: UploadInput = {
              type: 'uploadFile',
              url: environment.urlBackend + '/file',
              method: 'POST',
              file: file
          }    
         this.uploadInput.emit(event);
    } else if (output.type === 'uploading') {
      // update current data for uploading file
      this.file = output.file;
    } else if (output.type === 'done') {
     (...)
    } 
  }