Angular uib-dropdown 上的键盘导航无法正常工作

Question

我正在使用 Angular Bootstrap 2.2.0 和 Angular 1.5.

即使启用了 keyboard-nav 选项，键盘导航也无法在 UIB 下拉菜单中使用。这是我的代码：

<div class="btn-group"
     uib-dropdown
     keyboard-nav="true"
     on-toggle="vm.setTouchNgModel(open)">

     <button type="button"
             class="btn btn-secondary btn-dropdown"
             ng-class="{'text-muted': !vm.selectedOptionLabel }"
             uib-dropdown-toggle
             ng-disabled="vm.selectDisabled">
             {{ vm.selectedOptionLabel || ((vm.selectPlaceholder | translate) || vm.selectPlaceholder) }}
             <i class="caret"></i>
     </button>

     <ul class="dropdown-menu"
         uib-dropdown-menu
         role="menu"
         aria-labelledby="btn-append-to-single-button">
         <li ng-if="vm.inlineOption">
             <a ng-click="vm.setSelectModel(vm.inlineOption)">{{ vm.inlineOption[vm.labelProperty] }}</a>
         </li>
         <li ng-repeat="option in ((vm.filterName && vm.applyFilter(vm.options, vm.filterName, vm.filterOptions, vm.filterExpression)) || vm.options)">
             <a role="menuitem" ng-click="vm.setSelectModel(option)">{{ ((option[vm.labelProperty] || option.label || option) | translate) || ((option[vm.labelProperty] || option.label || option) | translate) }}</a>
         </li>
      </ul>

</div>

Answer 1

我找到了解决方案，选择 <a> 标签中需要有一个 href 属性，keyboard-nav 才能工作。

Answer 2

<a> 标签需要 tabindex 属性才能获得焦点。

将tabindex="0"添加到所有这些。值“0”使它们可以按文档顺序制表。

Angular uib-dropdown 上的键盘导航无法正常工作

Keyboard navigation on Angular uib-dropdown is not working

javascript

twitter-bootstrap

angularjs

angular-bootstrap