File

core/drop-area/drop-area.component.ts

Index

Properties
Methods

Methods

readAsArrayBuffer
readAsArrayBuffer()
Returns : any
readAsBinaryString
readAsBinaryString()
Returns : any
readAsDataURL
readAsDataURL()
Returns : any
readAsJson
readAsJson()
Returns : any
readAsText
readAsText()
Returns : any

Properties

file
file: File
Type : File

Drop area component

A drop-zone which is a file selector allowing users to select file(s) from their file system, either natively or by drag and drop. Allows to select a binary for upload, or to specify uri to external resource. Component provides drop area functionality allowing you to just drop files within specified area. Attributes:

  • class="drop-area-sm" - prevents component from occupying whole available area
  • dropped-file object of droppedFiles[] type: droppedFiles[]; element { file { lastModified: 168271687167, lastModifiedDate: Tue Nov 17 2020 08:37:11 GMT+0000, name: "Dropped File.txt, size: 35279, type: "", webkitRelativePath: "" } } could be handled by following function: onFileDropped(droppedFiles: DroppedFile[]) { this.onFilesPicked.emit({ droppedFiles }); }
  • title - display info for user, i.e. 'Drop file or click to browse'
  • maxAllowedFiles - describe how many files can be dropped once, accept only numbers
  • files - type FileList, it is used to check the length of dropped array of files
  • $event - object of droppedFiles[] type

Usage Example:

<div>
    <c8y-drop-area
        class="drop-area-sm"
        (dropped)="onFileDropped($event)"
        [title]="'Drop file or click to browse'"
        [maxAllowedFiles]="maxAllowedFiles"
        [files]="droppedFiles">
    </c8y-drop-area>
</div>
    <c8y-drop-area>
      <h4>Put file here, it's a drop area</h4>
    <c8y-drop-area>

results matching ""

    No results matching ""