角度のブートストラップドロップダウンが左に開きます

Question

角度ブートストラップドロップダウンを正常に使用しましたlink。 しかし、右側にドロップダウンが表示されるという問題があります。 どうすれば左に開くことができますか？ ここには、指定されたリンクから使用されたマークアップとjsがあります。

マークアップ：

<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：

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')); 
}); 

Answer 1

があなたの<ul uib-dropdown-menu>にクラスdropdown-menu-rightを追加します助けてください。

デフォルトでは、ドローダウンは親の左側に合わせて開き、右側に向かって拡大します。クラスdropdown-menu-rightを追加すると、右側に整列して開きます。