拆分按钮不会切换Angular,JS

时间:2017-01-18 16:32:26

标签: javascript html angularjs

我已经看到了一些与此类似的问题,但我没有遇到过有用的答案。任何人都可以看看我的代码吗?

我在组件中分配了{{$ ctrl.init}}和{{$ ctrl.people}}。我知道这个分配是有效的,因为如果我拿走“分割按钮”并直接在模板上打印它们,我可以点击它们并正常重定向,没有问题。

这是我模板中的代码:

<div class="container-fluid">
  <div class="row">
    <div class="col-md-2">
    <!--Sidebar content-->
       <div class="btn-group btn-xs" uib-dropdown ng-cloak>
         <button id="mydd" type="button" class="btn btn-primary dropdown-toggle btn-xs" data-toggle="dropdown" aria-haspopup="true">Action
          <span class="caret"></span></button>
          <ul class="dropdown-menu" role="menu" aria-labelledby="mydd">
              <li><a href="{{$ctrl.init}}">Start</a></li>
              <li><a href="{{$ctrl.people}}">People</a></li>
          </ul>
       </div> 
    </div>
  </div>
</div>

当我添加按钮时,我得到了正确的样式,但它没有下拉或显示选项。没有反应。

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

试试这个。

您应该将ui.bootstrap模块添加到主应用。

在控制器中定义$scope.isCollapsed = true; 并将uib-collapse="isCollapsed"指令添加到ul代码

  <div class="container-fluid">
  <div class="row">
   <div class="col-md-2">
   <!--Sidebar content-->
   <div class="btn-group btn-xs" uib-dropdown ng-cloak>
     <button id="mydd" type="button" ng-click="isCollapsed = !isCollapsed" class="btn btn-primary dropdown-toggle     btn-xs" data-toggle="dropdown" aria-haspopup="true">Action
         <span class="caret"></span></button>
         <ul class="dropdown-menu" uib-collapse="isCollapsed" role="menu" aria-labelledby="mydd">
          <li><a href="{{$ctrl.init}}">Start</a></li>
          <li><a href="{{$ctrl.people}}">People</a></li>
        </ul>
       </div> 
    </div>
    </div>
</div>