Question

我想拆分普通的selectbox，它应该看起来像默认的ui bootstrap下拉列表。我已经使用了uibootstrap下拉列表，但选择了问题下拉值不会像正常的下拉列表一样显示在顶部。

请告诉我如何拆分选择。？

Answer 1

您可以使用ui bootstrap分割按钮将当前所选项目用作按钮标签，如下所示：

<!-- Split button -->
<div class="btn-group dropdown" uib-dropdown="" style="">
  <button id="split-button" type="button" class="btn btn-danger">{{selectedItem || 'Choose Item'}}</button>
  <button type="button" class="btn btn-danger dropdown-toggle" uib-dropdown-toggle="" aria-haspopup="true" aria-expanded="true">
    <span class="caret"></span>
  </button>
  <ul uib-dropdown-menu="" role="menu" aria-labelledby="split-button" class="dropdown-menu">
    <li role="menuitem" ng-repeat="item in items" ng-click="selectItem(item)"><a href>{{item}}</a></li>
  </ul>
</div>

在你的控制器中：

$scope.items = ['action 1','action 2','action 3'];

$scope.selectItem = function(item) {
  $scope.selectedItem = item;
}

请参阅此plnkr：http://plnkr.co/edit/RZoMoa2t3JZDNiZ3eQoW?p=preview

怎么做拆分选择像ui bootstrap slipt下拉列表

1 个答案: