Skip to content

Instantly share code, notes, and snippets.

🌈
I'm fine

William Koza wKoza

🌈
I'm fine
Block or report user

Report or block wKoza

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View upload.component.ts
import { Component, OnInit } from '@angular/core';
import { FileItem, HttpClientUploadService } from '@wkoza/ngx-upload';
@Component({
selector: 'app-root',
templateUrl: './simple.component.html',
styleUrls: ['./simple.component.css']
})
export class SimpleBootstrapComponent implements OnInit {
View options2.ts
optionsInput: InputFileOptions = {
multiple: true,
accept: [MineTypeEnum.Image, MineTypeEnum.Application_Pdf]
};
View material.html
<button mat-raised-button [color]="'primary'" >
<ng-template ngxInputFile> Upload local files</ng-template>
</button>
View bootstrap.html
<span class="btn btn-outline-success btn-s" *ngxInputFile>Upload local files</span>
View dropzone2.html
<div class="my-drop-zone" ngxDragAndDrop *ngxInputFile>
Drop files here to upload
</div>
View dropzone.html
<div class="my-drop-zone" ngxDragAndDrop="ngxDropTargetOptions">
Drop files here to upload
</div>
View app.module.ts
@NgModule({
imports: [
BrowserModule,
HttpClientModule,
NgxUploadModule.forRoot(ngxDropTargetOptions)
]
})
export class AppModule {}
View options.ts
export const ngxDropTargetOptions: DropTargetOptions = {
color: 'dropZoneColor',
colorDrag: 'dropZoneColorDrag',
colorDrop: 'dropZoneColorDrop'
};
View styles.css
.dropZoneColor {
border: 3px dotted rgba(0,0,0,0.08);
background-color: rgba(0,0,0,0.12)
}
.dropZoneColorDrag {
border: 3px dotted rgba(0,0,0,0.28);
background-color: grey
}
View style.css
.my-drop-zone {
  width: 300px;
  height: 300px;
  cursor: pointer;
  padding: 1em;
  opacity: 0.4;
  text-align: center;
}
You can’t perform that action at this time.