angular-ui-bootstrap – Angular UI Bootstrap的两个下拉列表不

发布时间：2020-12-17 17:40:49 所属栏目：安全来源：网络整理

导读：我只是通过复制和粘贴Angular UI Bootrstrap Dropdown官方样本创建了第二个下拉列表,现在两个人都没有下拉菜单.请参阅plunker http://plnkr.co/edit/Xpp4sBSOoCK2lNZN3ZrL?p=preview !-- Single button 1--div class="btn-group" dropdown is-open="status.i

我只是通过复制和粘贴Angular UI Bootrstrap Dropdown官方样本创建了第二个下拉列表,现在两个人都没有下拉菜单.请参阅plunker

http://plnkr.co/edit/Xpp4sBSOoCK2lNZN3ZrL?p=preview

<!-- Single button 1-->
<div class="btn-group" dropdown is-open="status.isopen">
  <button id="btn1" type="button" class="btn btn-primary dropdown-toggle" ng-disabled="disabled">
    Button dropdown <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Action</a></li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
</div>
<!-- Single button 2-->
<div class="btn-group" dropdown is-open="status.isopen">
  <button id="btn2" type="button" class="btn btn-primary dropdown-toggle" ng-disabled="disabled">
    Button dropdown1 <span class="caret"></span>
  </button>
  <ul id="list2" class="dropdown-menu" role="menu">
    <li><a href="#">Action</a></li>
    <li><a href="#">Another action</a></li>
    <li><a href="#">Something else here</a></li>
    <li class="divider"></li>
    <li><a href="#">Separated link</a></li>
  </ul>
</div>

解决方法

你需要2个单独的变量用于is-open属性,工作plunk here

代码已更改：

$scope.status = {
  isopen1: false,isopen2: false
 };


<div class="btn-group" dropdown is-open="status.isopen1">

<div class="btn-group" dropdown is-open="status.isopen2">

值得一提的是使用is-open属性是没有必要的.您将注意到,如果使用绑定删除is-open属性,则下拉列表将起作用.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!