Topic: Get response from file upload

rctoone pro asked 6 years ago


Is there anyway to subscribe or get the response from the File Upload? I am not sure how to pull that from the event?
startUpload(): void {
        const event: UploadInput = {
        type: 'uploadAll',
        url: '/upload',
        method: 'POST',
        data: { foo: 'bar' },
        concurrency: 1
        }

        this.uploadInput.emit(event);
    }

Witold Tkaczyk free answered 6 years ago


Hello rctoone,

you can do this using ng2-file-upload.Below is what it should looks like:

import { Component } from '@angular/core';
import {FileUploader, FileItem, ParsedResponseHeaders} from "ng2-file-upload";
@Component({
    selector: 'upload-file',
    template: '<input type="file" ng2FileSelect [uploader]="uploader">',
})
export class UploadFileComponent {
    uploader:FileUploader;
    ngOnInit(): void {
        this.uploader = new FileUploader({
            url: 'http://url.to/upload',
            headers: [{name:'Accept', value:'application/json'}],
            autoUpload: true,
        });
        this.uploader.onErrorItem = (item, response, status, headers) => this.onErrorItem(item, response, status, headers);
        this.uploader.onSuccessItem = (item, response, status, headers) => this.onSuccessItem(item, response, status, headers);
    }
    onSuccessItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any {
        let data = JSON.parse(response); //success server response
    }
    onErrorItem(item: FileItem, response: string, status: number, headers: ParsedResponseHeaders): any {
        let error = JSON.parse(response); //error server response
    }
}


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
Tags