我正在尝试仅使用键盘浏览记录列表。当页面加载时，默认的“焦点”应该在第一条记录上，当用户单击键盘上的向下箭头时，需要聚焦下一条记录。当用户单击向上箭头时，应聚焦前一条记录。当用户单击 Enter 按钮时，应该将他们带到该记录的详细信息页面。
到目前为止，我对 Plunker 的了解如下。
AngularJS 1.1.5（不稳定）似乎支持这一点，但我们不能在生产中使用。我目前使用的是1.0.7。我希望做这样的事情 - 密钥应该在文档级别处理。当用户按下某个键时，代码应该在允许的键数组中查找。如果找到匹配项（例如向下键代码），它应该将焦点移动（应用 .highlight css）到下一个元素。当按下回车键时，它应该抓取 .highlight css 的记录并获取记录 id 以进行进一步处理。
谢谢你！
以下是您可以选择执行的操作的示例：http://plnkr.co/edit/XRGPYCk6auOxmylMe0Uu?p=preview
<body key-trap>
<div ng-controller="testCtrl">
<li ng-repeat="record in records">
<div class="record"
ng-class="{'record-highlight': record.navIndex == focu sIndex}">
{{ record.name }}
</div>
</li>
</div>
</body>
这是我能想到的最简单的方法。
它绑定了一个指令keyTrap to the body这抓住了keydown事件和$broadcast发送给子作用域的消息。
元素持有者范围将捕获消息并简单地增加或减少
focusIndex 或触发open如果击中则函数enter.
EDIT
http://plnkr.co/edit/rwUDTtkQkaQ0dkIFflcy?p=preview
现在支持有序/过滤列表。
事件处理部分没有改变，但现在使用$index以及过滤列表缓存
结合技术来跟踪哪个项目正在获得关注。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
