相关疑难解决方法(0)

AngularJS ng-keydown指令仅适用于<input>上下文?

我是AngularJS的新手,但到目前为止我发现它非常符合我的喜好.对于我目前的项目,我需要热键功能,很高兴看到自1.1.2版本以来它受支持.

ng-keydown指令(http://code.angularjs.org/1.1.3/docs/api/ng.directive:ngKeydown)按输入类型的预期工作,但是对于任何其他上下文(如div等)都不能使用鉴于文件说不然.

这是一个最小的例子(http://jsfiddle.net/TdXWW/12/),分别是不工作的:

<input ng-keydown="keypress($event)">
<div ng-keydown="keypress($event)">
Run Code Online (Sandbox Code Playgroud)

注意:我知道这可以用简单的jQuery(http://www.mkyong.com/jquery/how-to-check-if-an-enter-key-is-pressed-with-jquery/)来处理,但我很多更愿意了解如何在AngularJS中处理它.

hotkeys angularjs

38
推荐指数
4
解决办法
5万
查看次数

使用键盘导航UI

考虑以下标记 -

<ul id="list">
    <li class="list-item" tabindex="0">test 1</li>
    <li class="list-item" tabindex="1">test 2</li>
    <li class="list-item" tabindex="2">test 3</li>
    <li class="list-item" tabindex="3">test 4</li>
    <li class="list-item" tabindex="4">test 5</li>
    <li class="list-item" tabindex="5">test 6</li>
    <li class="list-item" tabindex="6">test 7</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

和这段jQuery代码 -

$(".list-item").bind({
    keydown: function(e) {
        var key = e.keyCode;
        var target = $(e.currentTarget);

        switch(key) {
            case 38: // arrow up
                target.prev().focus();
                break;
            case 40: // arrow down
                target.next().focus();
                break;
        }
    },

    focusin: function(e) {
        $(e.currentTarget).addClass("selected");
    },

    focusout: function(e) {
        $(e.currentTarget).removeClass("selected");
    }
});
$("li").first().focus();
Run Code Online (Sandbox Code Playgroud)

如何以角度方式移植此代码?到目前为止我有这个 -

 <li …
Run Code Online (Sandbox Code Playgroud)

angularjs

12
推荐指数
2
解决办法
3万
查看次数

标签 统计

angularjs ×2

hotkeys ×1