ngx-upload-dragdrop-app v0.0.0

NgxUploadDragdropApp

This project was generated with Angular CLI version 8.2.1.

Installation

Add ngx-uploader module as dependency to your project.

npm install ngx-uploader --save

Include NgxUploadDragdropModule into your main AppModule or in module where you will use it.

// app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { NgxUploadDragdropModule } from 'ngx-upload-dragdrop';

 
@NgModule({
  imports: [
    BrowserModule,
    NgxUploadDragdropModule
  ],
  declarations: [ AppComponent ]
})
export class AppModule {}

or include NgxUploadDragdropModule into your SharedModule. This could be usefull if your project has nested Modules.

// shared.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { NgxUploadDragdropModule } from 'ngx-upload-dragdrop';
...
 
@NgModule({
  imports: [
    CommonModule,
    NgxUploaderModule,
    ...
  ],
  exports: [
    CommonModule,
    NgxUploaderModule,
    ...
  ],
  ...
})
export class SharedModule {
}

// app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { SharedModule } from './shared.module';
 
@NgModule({
  imports: [
    BrowserModule,
    SharedModule
  ],
  declarations: [ AppComponent ]
})
export class AppModule {}

#Template Code ##For whole template code please check here.

<app-upload [uploadIconClass]="upload_icon_class" [trashIconClass]="trash_icon_class"  (onFileDropped)="uploadFiles($event)"></app-upload>

#Typescript Code ##For whole Typescript code please check here.

upload_icon_class = "fas fa-upload";
trash_icon_class = "fas fa-trash fa-1x";

uploadFiles(event) {
    console.log(event);
  }

Upcoming features

• Presignin
• File type restrictions
• Icons
• Customclass
• File size restrictions
• Onsuccess
• OnFailure

SOURCE CODE