// app.component.ts import { Component, OnInit } from '@angular/core'; import { FileUploader, FileSelectDirective } from 'ng2-file-upload/ng2-file-upload'; const UploadURL = 'http://localhost:3000/api/upload'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.css'] }) export class AppComponent implements OnInit { title = 'Upload a File'; public uploader: FileUploader = new FileUploader({url: URL, itemAlias: 'photo'}); ngOnInit() { this.uploader.onAfterAddingFile = (file) => { file.withCredentials = false; }; this.uploader.onCompleteItem = (item: any, response: any, status: any, headers: any) => { console.log('FileUpload:uploaded:', item, status, response); alert('File uploaded successfully'); }; } }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter