Импорт

import-dropzone.ts
import { NuiDropzone, type NuiUploader } from '@needless-ui/angular/dropzone';

NuiDropzone

Зона, куда перетаскивают файлы или где их выбирают.

Селектор
nui-dropzone
NuiDropzone: Свойства
ИмяТипПо умолчаниюОписание
filesДвустороннийFile[][]Хранимые файлы по порядку.
acceptInputstringДопустимые типы файлов, как у <input type="file">.
multipleInputbooleantrueНесколько файлов за раз.
directoryInputbooleanfalseДобавляет кнопку выбора папки.
maxFilesInputnumberInfinityСколько файлов может хранить зона.
maxSize, minSizeInputnumber (bytes)Максимальный и минимальный размер файла в байтах.
validateInput(file: File) => string | nullПроверяет каждый файл. Если функция вернёт сообщение, файл отклоняется.
uploadInputNuiUploader<R>Отправляет файл. Без неё файлы только хранятся.
concurrencyInputnumber3Сколько файлов загружается одновременно.
hintInputstringСтрока под текстом зоны, например о том, какие файлы она принимает.
disabledInputbooleanfalseЗона не принимает файлы.
labelsInputPartial<NuiDropzoneLabels>Все показываемые и озвучиваемые тексты — для перевода.
uploadedOutputNuiUpload<R>Передаёт загруженный файл вместе с тем, что вернула upload.
rejectedOutput{ file, reason }[]Передаёт отклонённые файлы с причинами.
queueСвойствоNuiUploadQueue<R>Очередь загрузки: чтобы отменять, повторять и читать прогресс из кода.
takeМетод(files: Iterable<File>) => voidДобавляет файлы из кода, проверяя каждый.

NuiUploader

Отправляет один файл: сообщает о прогрессе от 0 до 1 и останавливается по сигналу отмены.

NuiUploader: Свойства
ИмяТипПо умолчаниюОписание
(file, context)Метод(file: File, { signal, progress }) => Promise<R>Возвращает промис с тем, что ответит ваш сервер.