Nincompoops Producing Methane
    Have ideas to improve npm?Join in the discussion! »

    ng2-fancy-image-uploader
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.1 • Public • Published

    Fancy Image Uploader npm version Dependencies

    Angular2 component that uploads selected or dropped image asynchronously with preview.

    Demo

    See demo here: demo

    Install

    npm install ng2-fancy-image-uploader --save
    

    Usage

    Add image uploader module to your module's imports

    import { NgModule } from '@angular/core';
    import { BrowserModule  } from '@angular/platform-browser';
    import { AppComponent } from './app';
     
    import { FancyImageUploaderModule } from 'ng2-fancy-image-uploader';
     
    @NgModule({
      imports: [BrowserModule, FancyImageUploaderModule],
      declarations: [AppComponent],
      bootstrap: [AppComponent]
    })
    export class AppModule {}

    Use it in your component

    import { Component } from '@angular/core';
    import { FancyImageUploaderOptions, UploadedFile } from 'ng2-fancy-image-uploader';
     
    @Component({
      selector: 'example-app',
      template: '<fancy-image-uploader [options]="options" (onUpload)="onUpload($event)"></fancy-image-uploader>'
    })
    export class AppComponent {
      options: FancyImageUploaderOptions = {
          thumbnailHeight: 150,
          thumbnailWidth: 150,
          uploadUrl: 'http://some-server.com/upload',
          allowedImageTypes: ['image/png', 'image/jpeg'],
          maxImageSize: 3
      };
      
      onUpload(file: UploadedFile) {
        console.log(file.response);
      }
    }
     

    License

    MIT © Olegas Gončarovas

    Install

    npm i ng2-fancy-image-uploader

    DownloadsWeekly Downloads

    102

    Version

    2.0.1

    License

    MIT

    Last publish

    Collaborators

    • avatar