角度引导下拉打开左侧

I have used angular bootstrap dropdown successfully link. But the problem it that the dropdown opens on the right side. How can i make it to open on left? Here is the markup and js i used from the given link.

我已成功使用angular bootstrap dropdown链接。但问题是下拉列表在右侧打开。我怎么能让它在左边打开？这是我在给定链接中使用的标记和js。

Markup:

标记：

<div ng-controller="DropdownCtrl">
<!-- Single button with keyboard nav -->
<div class="btn-group" uib-dropdown keyboard-nav>
    <button id="simple-btn-keyboard-nav" type="button" class="btn btn-primary" uib-dropdown-toggle>
        Dropdown with keyboard navigation <span class="caret"></span>
    </button>
    <ul uib-dropdown-menu role="menu" aria-labelledby="simple-btn-keyboard-nav">
        <li role="menuitem"><a href="#">Action</a></li>
        <li role="menuitem"><a href="#">Another action</a></li>
        <li role="menuitem"><a href="#">Something else here</a></li>
        <li class="divider"></li>
        <li role="menuitem"><a href="#">Separated link</a></li>
    </ul>
</div>
</div>

js:

JS：

angular.module('ui.bootstrap.demo').controller('DropdownCtrl', function ($scope, $log) {
$scope.items = [
'The first choice!',
'And another choice for you.',
'but wait! A third!'
];

$scope.status = {
isopen: false
};

$scope.toggled = function(open) {
$log.log('Dropdown is now: ', open);
};

$scope.toggleDropdown = function($event) {
$event.preventDefault();
$event.stopPropagation();
$scope.status.isopen = !$scope.status.isopen;
};

$scope.appendToEl = angular.element(document.querySelector('#dropdown-long-content'));
});

please help

请帮忙

1 个解决方案

#1

Add the class dropdown-menu-right to your <ul uib-dropdown-menu>.

将类下拉菜单右键添加到

By default, the drowpdown opens aligned to the left side of the parent and growing towards right side. When added the class dropdown-menu-right it will open aligned on the right side.

默认情况下，drowpdown打开与父项左侧对齐并向右侧增长。当添加类下拉菜单右侧时，它将在右侧打开对齐。

#1