I am currently utilizing Angular Bootstrap 2.2.0 in conjunction with Angular 1.5.
Despite enabling the keyboard-nav
option, I am experiencing issues with keyboard navigation on UIB dropdowns. Below is the snippet of my code:
<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>