gpt4 book ai didi

angular - 在浏览器的输入中检测 Ctrl + C 和 Ctrl + V

转载 作者:太空狗 更新时间:2023-10-29 17:41:56 24 4
gpt4 key购买 nike

我正在使用直接跟随,但我没有检测到使用输入中的键复制和粘贴,有人知道怎么做吗?谢谢!

export class OnlyNumberDirective {
// Allow decimal numbers. The \, is only allowed once to occur
private regex: RegExp = new RegExp(/[0-9]+(\,[0-9]{0,1}){0,1}$/g);

// Allow key codes for special events. Reflect :
// Backspace, tab, end, home
private specialKeys: Array<string> = [ 'Backspace', 'Tab', 'End', 'Home', 'Delete', 'Del', 'Ctrl', 'ArrowLeft', 'ArrowRight', 'Left', 'Right' ];

constructor(private el: ElementRef) {
}

@HostListener('keydown', [ '$event' ])
onKeyDown(event: KeyboardEvent): string {
// Allow Backspace, tab, end, and home keys
if (this.specialKeys.indexOf(event.key) !== -1) {
return null;
}

// Do not use event.keycode this is deprecated.
// See: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode
let current: string = this.el.nativeElement.value;
// We need this because the current value on the DOM element
// is not yet updated with the value from this event
let next: string = current.concat(event.key);
if (next && !String(next).match(this.regex)) {
event.preventDefault();
return null;
} else {
return next;
}
}
}

最佳答案

您可以简单地执行操作:有关信息,此代码管理所有使用 CMD 而不是 ctrl 的 mac 用户

@HostListener('window:keydown',['$event'])
onKeyPress($event: KeyboardEvent) {
if(($event.ctrlKey || $event.metaKey) && $event.keyCode == 67)
console.log('CTRL + C');
if(($event.ctrlKey || $event.metaKey) && $event.keyCode == 86)
console.log('CTRL + V');
}

如果你想检测其他类型的快捷方式:

  • event.ctrlKey
  • event.altKey
  • event.metaKey(Mac 用户也称为 Cmd)

Online sample

--- 评论后更新---

你可以这样做

  ngOnInit() {
this.bindKeypressEvent().subscribe(($event: KeyboardEvent) => this.onKeyPress($event));
}

onKeyPress($event: KeyboardEvent) {
if(($event.ctrlKey || $event.metaKey) && $event.keyCode == 67)
console.log('CTRL + C');
if(($event.ctrlKey || $event.metaKey) && $event.keyCode == 86)
console.log('CTRL + V');
}

private bindKeypressEvent(): Observable<KeyboardEvent> {
const eventsType$ = [
fromEvent(window, 'keypress'),
fromEvent(window, 'keydown')
];
// we merge all kind of event as one observable.
return merge(...eventsType$)
.pipe(
// We prevent multiple next by wait 10ms before to next value.
debounce(() => timer(10)),
// We map answer to KeyboardEvent, typescript strong typing...
map(state => (state as KeyboardEvent))
);
}

或者如果不起作用,只需:

private bindKeypress(): Observable<KeyboardEvent> {
const typeOfEvent = this.deviceService.getKeybordEvent();
fromEvent(window, typeOfEvent)
.pipe(
// We map answer to KeyboardEvent, typescript strong typing...
map(state => (state as KeyboardEvent))
);
}

其中 this.deviceService.getKeybordEvent(); 是返回基于用户代理的事件类型的方法。 massive list of user agent can be find here

关于angular - 在浏览器的输入中检测 Ctrl + C 和 Ctrl + V,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49920652/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com