我已经开始研究Angular2,并基本完成了3个嵌套组件的工作.但是我无法解决如何向文档添加一个按键处理程序.
如果没有,我如何听文本上的按键并对其做出反应？
要清楚,我需要对文档本身做出回应,而不是输入.
在Angular 1中,我将创建一个指令并使用$document;这样的：
- $document.on("keydown",function(event) {
- // if keycode...
- event.stopPropagation();
- event.preventDefault();
- scope.$apply(function() {
- // update scope...
- });
但是我还没有找到一个Angular2解决方案.
你可以这样做：
- @Component({
- host: {
- '(document:keyup)': '_keyup($event)','(document:keydown)': '_keydown($event)',},})
- export class Component {
- private _keydown(event: KeyboardEvent) {
- let prevent = [13,27,37,38,39,40]
- .find(no => no === event.keyCode);
- if (prevent) event.preventDefault();
- }
- private _keyup(event: KeyboardEvent) {
- if (event.keyCode === 27) this.close();
- else if (event.keyCode === 13) ...;
- else if (event.keyCode === 37) ...;
- else if (event.keyCode === 38) ...;
- else if (event.keyCode === 39) ...;
- else if (event.keyCode === 40) ...;
- // else console.log(event.keyCode);
- }
- }
BTW,角队有一些有趣的ideas about keyboard events,不知道现在的状态是什么.甚至可能it’s working,没有尝试自己:)
