禁用Angular uib-dropdown中的菜單項

Question

在我的角模板中，我使用angular-ui創建了一個下拉菜單，我需要根據定義的「公司」對象的屬性禁用部分列表項在ng-repeat中。

我已經試過已禁用標記或ng禁用指令但沒有成功。我怎麼能做到這一點？

我當前的代碼：

<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

您可以使用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> 

EDIT

根據自舉documentation，殘疾人類必須被施加到<li>元件。