NEURALNG
FORMSBETA

FileUpload

Native file selection, drag and drop, immutable file arrays, deterministic validation events and one model for every Angular Forms API.

Immutable File arraysDrag and dropHTTP agnostic

GET STARTED

Import

Import the canonical standalone control from its granular entry point.

app.ts TypeScript
import {
  NeuralFileUpload,
  type NeuralFileUploadValue,
} from '@neural-ng/core/file-upload';

Multiple files and Signal Forms

The model is always readonly File[]. Multiple mode appends accepted files without mutating the supplied array.

Drop files here

No files selected

PDF or image, up to 10 MB each.
No selection event yet.

Single-file mode

Without multiple, the next accepted selection replaces the previous file while preserving the array-shaped model.

Drop a file here

No files selected

Angular Forms

Signal Forms, Reactive Forms and template-driven forms bind the same immutable file-array contract.

Drop a file here
0 selected
Drop a file here
0 selected
Drop a file here
0 selected

Client-side constraints

accept, size, count and duplicate checks produce deterministic rejection reasons. They improve UX but never replace server validation.

Drop files here

No files selected

No selection event yet.

Control states

Readonly keeps the visible value inspectable while blocking mutation; disabled follows Forms ownership. Invalid, required and pending stay independent.

Drop a file here

No files selected

Drop a file here

No files selected

Drop a file here

No files selected

Drop a file here

No files selected

Labels, icons and compact list ownership

Every visible string can override the active locale and Neural Icons can be assigned without custom projected markup.

Drop release assets here

No release assets

Application-owned HTTP upload

FileUpload has no URL, headers, authentication, progress, retry or chunking API. Build FormData and choose the transport in application code.

upload.ts TypeScript
const body = new FormData();
for (const file of attachments()) {
  body.append('attachments', file, file.name);
}

http.post('/api/applications', body, {
  reportProgress: true,
  observe: 'events',
});
HTTP upload remains application-owned.

Unstyled and typed slots

Native chooser behavior, drag and drop, announcements and immutable state remain while consumer classes own every visual slot.

Drop files here

No files selected