Skip to main content

CurrencyInputComponent

A form input control which displays currency in decimal format, whilst working with the integer cent value in the background.

Example

HTML
<vdr-currency-input    [(ngModel)]="entityPrice"    [currencyCode]="currencyCode"></vdr-currency-input>
Signature
class CurrencyInputComponent implements ControlValueAccessor, OnInit, OnChanges, OnDestroy {    @Input() disabled = false;    @Input() readonly = false;    @Input() value: number;    @Input() currencyCode = '';    @Output() valueChange = new EventEmitter();    prefix$: Observable<string>;    suffix$: Observable<string>;    hasFractionPart = true;    onChange: (val: any) => void;    onTouch: () => void;    _inputValue: string;    readonly precision: number;    readonly precisionFactor: number;    constructor(dataService: DataService, currencyService: CurrencyService)    ngOnInit() => ;    ngOnChanges(changes: SimpleChanges) => ;    ngOnDestroy() => ;    registerOnChange(fn: any) => ;    registerOnTouched(fn: any) => ;    setDisabledState(isDisabled: boolean) => ;    onInput(value: string) => ;    onFocus() => ;    writeValue(value: any) => void;}
  • Implements: ControlValueAccessor, OnInit, OnChanges, OnDestroy

disabled

property

readonly

property

value

propertynumber

currencyCode

property

valueChange

property

prefix$

propertyObservable<string>

suffix$

propertyObservable<string>

hasFractionPart

property

onChange

property(val: any) => void

onTouch

property() => void

_inputValue

propertystring

precision

propertynumber

precisionFactor

propertynumber

constructor

method(dataService: DataService, currencyService: CurrencyService) => CurrencyInputComponent

ngOnInit

method() =>

ngOnChanges

method(changes: SimpleChanges) =>

ngOnDestroy

method() =>

registerOnChange

method(fn: any) =>

registerOnTouched

method(fn: any) =>

setDisabledState

method(isDisabled: boolean) =>

onInput

method(value: string) =>

onFocus

method() =>

writeValue

method(value: any) => void
Was this chapter helpful?
Report Issue
Edited Feb 3, 2026·Edit this page