禁用Angular uib-dropdown中的菜单项

Question

在我的角度模板中,我正在使用angular-ui创建一个下拉菜单,我需要根据ng-repeat中定义的"company"对象的属性禁用某些列表项.

我已经尝试过禁用标签或ng-disabled指令但没有成功.我怎样才能实现这一目标？

我目前的代码:

<div class="btn-group" uib-dropdown is-open="dropdown-open">
    <button id="companyDropDown" type="button" class="btn btn-default"
     uib-dropdown-toggle>
         {{companyDescr}}<span class="caret"></span>
    </button>
    <ul class="dropdown-menu" uib-dropdown-menu role="menu"
     aria-labelledby="companyDropDown">
        <li role="menuItem" ng-repeat="company in companyContracts">
            <a ng-click="selectContract(company)">{{company.address}}</a>
        </li>
    </ul>
</div>

任何帮助将不胜感激!

Answer 1

您可以将disabledBootstrap 中的类与 Angular 中的 ng-class 指令一起使用。

HTML

 <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="companyDropDown">
    <li  ng-class="{'disabled': company.disabled }" role="menuItem" ng-repeat="company in companyContracts">
        <a ng-click="selectContract(company)">{{company.address}}</a>
    </li>
</ul>

编辑

根据 Bootstrap文档，必须将禁用的类应用于<li>元素。