【问题标题】:two dropdowns for Angular UI Bootstrap do not workAngular UI Bootstrap 的两个下拉菜单不起作用
【发布时间】:2014-08-21 06:18:33
【问题描述】:

我只是通过复制和粘贴官方 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>

【问题讨论】:

    标签: angular-ui-bootstrap


    【解决方案1】:

    is-open 属性需要 2 个单独的变量,工作 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 属性,下拉菜单将起作用。

    【讨论】:

    • 感谢 Rob J 的及时回复
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-01-18
    • 2015-05-26
    • 2013-01-21
    • 2012-03-20
    • 2021-12-19
    相关资源
    最近更新 更多