File Upload in Angular 4

Question

when I\'m trying to install \"npm install ng2-file-upload --save\" in my angular 4 application it throws

UNMET PEER DEPENDENCY @4.1.0
UNMET PEER DEPENDENCY          


        

Answer 1

You don't need an external library to do this, check below sample code

@Component({
    selector: 'app-root',
    template: '
'
        + ''
        + '
',
})

export class AppComponent {

    constructor(private _service: commonService) { }

    upload(event: any) {
        let files = event.target.files;
        let fData: FormData = new FormData;

        for (var i = 0; i < files.length; i++) {
            fData.append("file[]", files[i]);
        }
        var _data = {
            filename: 'Sample File',
            id: '0001'
        }

        fData.append("data", JSON.stringify(_data));

        this._service.uploadFile(fData).subscribe(
            response => this.handleResponse(response),
            error => this.handleError(error)
        )
    }
    handleResponse(response: any) {
        console.log(response);
    }
    handleError(error: string) {
        console.log(error);
    }
}

More info