Skip to content

Angular 4 example to create a drag and drop file upload for profile pictures based on ng2-file-upload

Notifications You must be signed in to change notification settings

scssat/angular-profile-picture-upload-example

 
 

Repository files navigation

Angular Profile Picture Upload Example

This is a small example on how to use the ng2-file-upload module to add a profile image with drag and drop capability.

  • Angular 4
  • ng2-file-upload
  • File upload through drag and drop
  • File upload through click and file selector

This example is not fully working without a service that stores images. This service is not included. The code is meant to be taken as a reference and built upon.

Screenshots

Empty Profile Picture Profile Picture after Upload

Development server

Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.

Build

Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the -prod flag for a production build.

About

Angular 4 example to create a drag and drop file upload for profile pictures based on ng2-file-upload

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 65.8%
  • HTML 15.1%
  • JavaScript 9.8%
  • CSS 9.3%