禁用Angular uib-dropdown中的菜单项

时间:2016-07-04 13:27:32

标签: html angularjs

在我的角度模板中,我正在使用 angular-ui 创建一个下拉菜单,我需要根据ng-中定义的“公司”对象的属性禁用某些列表项重复。

我已尝试已停用标记或 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>

非常感谢任何帮助!

1 个答案:

答案 0 :(得分:4)

你可以使用Bootstrap中的disabled类和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 documentation,禁用的类必须应用于<li>元素。