2016-07-04 21 views
5

Nel mio modello angolare sto creando un menu a discesa usando angular-ui, ho bisogno di disabilitare alcune voci dell'elenco basate su una proprietà dell'oggetto "società" definito nella ng-repeat.disattiva una voce di menu in Angular UIB-dropdown

Ho già provato il tag disabilitato o ng disabile direttiva ma senza successo. Come posso ottenerlo?

mio codice corrente:

<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> 

Qualsiasi aiuto sarebbe molto apprezzato!

risposta

3

È possibile utilizzare la classe disabled da Bootstrap con la direttiva di classe ng da Angular.

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

Secondo Bootstrap documentation, la classe disabile deve essere applicato all'elemento <li>.

+0

puoi aggiungere demo dal vivo – Developer

+1

http://jsfiddle.net/Ripley511/xh6mjsyL/9/ – Ripley511

+0

Grazie! Era così facile ... Sono ancora nuovo per l'ambiente: P – SMarello