Hlars/angular-comment-mentions
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add ability for copy and pasting for currency input

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app/currency-input/currency-input.component.html
View File

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

20
src/app/currency-input/currency-input.component.ts
View File

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