Skip to main content

File Upload

This section describes the BfmFileUploadComponent component.

Composition​

The BfmFileUploadComponent has no any composition component.

Usage​

You need to import it in your module and use it in your template.

import { BfmFileUploadComponent } from '@celerofinancas/ui-cash-flow';

@Component({
standalone: true,
selector: 'bfm-file-upload',
templateUrl: './file-upload.component.html',
styleUrls: ['./file-upload.component.scss'],
imports: [BfmFileUploadComponent],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class FileUploadComponent {}

Then, in your template, you can use the component like this:


<bfm-file-upload
[csvExampleSrc]="'example.csv'"
[fileExtensions]="['.csv', '.xls']"
[form]="uploadForm"
[loading]="isLoading"
[sendButtonLabel]="'Send File'"
(submitFile)="handleSubmitFile($event)"
/>

Inputs​

The BfmFileUploadComponent component has the following inputs:

csvExampleSrc​

Source URL for the CSV example file.

TypeDefault
string''

fileExtensions​

Array of allowed file extensions.

TypeDefault
string[]['.csv']

form​

Form group to be used in the file upload.

TypeDefault
FormGroupnew FormGroup({})

loading​

Flag to indicate if the component is in a loading state.

TypeDefault
booleanfalse

sendButtonLabel​

Label for the send file button.

TypeDefault
string'Enviar arquivo'

Events​

The BfmFileUploadComponent component has the following events:

submitFile​

Event emitted when the user submits a file.

Type
EventEmitter<File>