javascript - 如何区分原生的Ctrl+C和Ctrl+V以及使用Javascript添加的文档级监听器

Question

我有一个剪贴板服务，其中有一个 copy() 和 paste() 方法，只要我执行 Ctrl+C 就会调用这些方法> & Ctrl+V。这些是使用 HostListeners 添加到组件中的文档级键盘监听器。现在，每当用户复制一些文本并执行 Ctrl+V 时，我的 paste() 方法就会被触发，这是不应该发生的。我怎样才能防止这种情况发生。谁能指出我正确的方向？

我的剪贴板服务:

export class ClipService {
    private srcFolder;
    private srcItem;

    constructor() {
    }

    copy(srcFolder, srcItem) {
        this.srcFolder = srcFolder;
        this.srcItem = srcItem;
    }

    paste(destFolder) {

    }

}

我的组件:

@Component({
 selector: 'new-comp',
 templateUrl: 'new-comp.html'
})
export class NewComp {

constructor(private clipboard: ClipService){

}

private keydown(event: KeyboardEvent) {
        if (event.defaultPrevented) return;
        let folder = this.folder.json;
        let item = folder.activeItem;
        if (event.ctrlKey && event.keyCode === 67) {
            this.clipboard.copy(folder, item);
        } else if (event.ctrlKey && event.keyCode === 86) {
             this.clipboard.paste(this.finder.activeFolder);
        }
    }
}

谢谢。

Answer 1

而不是使用键盘事件来处理复制和粘贴。只需使用剪贴板事件来处理它们，如下所示:

@HostListener('document:copy', ['$event'])
copy(evt: ClipboardEvent) {
 let folder = this.folder.json;
 let item = folder.activeItem;
 this.clipboard.copy(folder, item);
}

@HostListener('document:paste', ['$event'])
paste(evt: ClipboardEvent) {
 this.clipboard.paste(this.finder.activeFolder);
}

注意:IE11 不支持剪贴板复制事件。

希望这对您有所帮助。