Class UploadButtonComponent

Implements

  • ControlValueAccessor
  • MatFormFieldControl<File>
  • OnDestroy

Constructors

Properties

accept: InputSignal<string | string[]> = ...
acceptAttribute: Signal<string | InputSignal<string | string[]>> = ...
allowDownload: InputSignal<boolean> = ...
autofilled?: boolean

Whether the input is currently in an autofilled state. If property is not present on the control it is assumed to be false.

controlType?: string = 'rxap-upload-button'

An optional name for the control type that can be used to distinguish mat-form-field elements based on their control type. The form field will add a class, mat-form-field-type-{{controlType}} to its root element.

disabled: boolean = false

Whether the control is disabled.

errorState: boolean = false

Whether the control is in an error state.

focused: boolean = false

Whether the control is focused.

isImageUploaded: WritableSignal<boolean> = ...
ngControl: null | NgControl = ...

Gets the AbstractControlDirective for this control.

positions: ConnectedPosition[] = ...
required: boolean = false

Whether the control is required.

shouldLabelFloat: boolean = true

Whether the MatFormField label should try to float.

snackBar: MatSnackBar = ...
stateChanges: Subject<void> = ...

Stream that emits whenever the state of the control changes such that the parent MatFormField needs to run change detection.

touched: boolean = false
uploaded: OutputEmitterRef<File> = ...
userAriaDescribedBy?: string

Value of aria-describedby that should be merged with the described-by ids which are set by the form-field.

value: null | File = null

The value of the control.

nextId: number = 0

Accessors

Methods

  • A callback method that performs custom clean-up, invoked immediately before a directive, pipe, or service instance is destroyed.

    Returns void

  • Handles a click on the control's container.

    Parameters

    • event: MouseEvent

    Returns void

  • Parameters

    • fn: any

      The callback function to register

    Returns void

    Registers a callback function that is called when the control's value changes in the UI.

    This method is called by the forms API on initialization to update the form model when values propagate from the view to the model.

    When implementing the registerOnChange method in your own value accessor, save the given function so your class calls it at the appropriate time.

    The following example stores the provided function as an internal method.

    registerOnChange(fn: (_: any) => void): void {
    this._onChange = fn;
    }

    When the value changes in the UI, call the registered function to allow the forms API to update itself:

    host: {
    '(change)': '_onChange($event.target.value)'
    }
  • Parameters

    • fn: any

      The callback function to register

    Returns void

    Registers a callback function that is called by the forms API on initialization to update the form model on blur.

    When implementing registerOnTouched in your own value accessor, save the given function so your class calls it when the control should be considered blurred or "touched".

    The following example stores the provided function as an internal method.

    registerOnTouched(fn: any): void {
    this._onTouched = fn;
    }

    On blur (or equivalent), your class should call the registered function to allow the forms API to update itself:

    host: {
    '(blur)': '_onTouched()'
    }
  • Sets the list of element IDs that currently describe this control.

    Parameters

    • ids: string[]

    Returns void

  • Parameters

    • isDisabled: boolean

      The disabled status to set on the element

    Returns void

    Function that is called by the forms API when the control status changes to or from 'DISABLED'. Depending on the status, it enables or disables the appropriate DOM element.

    The following is an example of writing the disabled property to a native DOM element:

    setDisabledState(isDisabled: boolean): void {
    this._renderer.setProperty(this._elementRef.nativeElement, 'disabled', isDisabled);
    }
  • Parameters

    • file: File

    Returns void

    Writes a new value to the element.

    This method is called by the forms API to write to the view when programmatic changes from model to view are requested.

    The following example writes a value to the native DOM element.

    writeValue(value: any): void {
    this._renderer.setProperty(this._elementRef.nativeElement, 'value', value);
    }