add ability for copy and pasting for currency input

This commit is contained in:
Hlars 2025-04-28 18:06:49 +02:00
parent 782500c009
commit 2190cc06e4
2 changed files with 20 additions and 6 deletions

View File

@ -1,6 +1,6 @@
<div>
<input #input [value]="formattedValue()" [readonly]="disabled" [attr.placeholder]="placeholder"
[attr.aria-describedby]="userAriaDescribedBy" [attr.required]="required" (input)="onUserInput($event)"
(keydown)="onInputKeyDown($event)" (keypress)="onInputKeyPress($event)" (paste)="onPaste($event)"
(focus)="onFocusIn($event)" (blur)="onFocusOut($event)" />
[attr.aria-describedby]="userAriaDescribedBy" [attr.required]="required" (keyup)="onInputKeyUp($event)"
(input)="onUserInput($event)" (keydown)="onInputKeyDown($event)" (keypress)="onInputKeyPress($event)"
(paste)="onPaste($event)" (focus)="onFocusIn($event)" (blur)="onFocusOut($event)" />
</div>

View File

@ -160,6 +160,7 @@ export class CurrencyInputComponent implements MatFormFieldControl<number>, Cont
@ViewChild('input') input!: ElementRef<HTMLInputElement>;
isSpecialChar: boolean | null | undefined = undefined;
isMaybePasting: boolean = false;
lastValue: string | null | undefined = undefined;
min: number = 0;
groupChar: string = '';
@ -269,8 +270,6 @@ export class CurrencyInputComponent implements MatFormFieldControl<number>, Cont
return { decimalCharIndex, minusCharIndex };
}
onUserInput(event: Event) {
if (this.disabled) {
return;
@ -288,11 +287,16 @@ export class CurrencyInputComponent implements MatFormFieldControl<number>, Cont
}
this.lastValue = (event.target as HTMLInputElement).value;
if ((event as KeyboardEvent).shiftKey || (event as KeyboardEvent).altKey || event.metaKey || event.ctrlKey) {
if ((event as KeyboardEvent).shiftKey || (event as KeyboardEvent).altKey) {
this.isSpecialChar = true;
return;
}
if (event.metaKey || event.ctrlKey) {
this.isMaybePasting = true;
return;
}
let selectionStart = (event.target as HTMLInputElement).selectionStart as number;
let selectionEnd = (event.target as HTMLInputElement).selectionEnd as number;
let inputValue = (event.target as HTMLInputElement).value as string;
@ -446,6 +450,11 @@ export class CurrencyInputComponent implements MatFormFieldControl<number>, Cont
// this.onKeyDown.emit(event);
}
onInputKeyUp(event: KeyboardEvent): void {
if (event.metaKey || event.ctrlKey) {
this.isMaybePasting = false;
}
}
onInputKeyPress(event: KeyboardEvent) {
if (this.disabled) {
@ -457,6 +466,11 @@ export class CurrencyInputComponent implements MatFormFieldControl<number>, Cont
let isDecimalSign = this.isDecimalSign(char);
const isMinusSign = this.isMinusSign(char);
// allow pasting or copying in the input field
if (this.isMaybePasting && (event.key === 'v' || event.key === 'c')) {
return;
}
if (code != 13) {
event.preventDefault();
}