2016-11-30 29 views
1

Я создаю навигацию в AngularJS. Некоторые ссылки должны быть отключены, поскольку пользователь не выполнил требования.Отключить элемент списка - angularjs

Я просмотрел угловую документацию, и я понял, что вы не можете использовать ng-disabled в элементе списка. Поэтому я использую ng-класс для удаления элементов списка. Вот HTML-код, который я использую в данный момент:

<li id="first"> 
    <div ng-click="vm.navigateTo(0)"> 
     <label translate="{{vm.translationKeys[0]}}"></label> 
    </div> 
</li> 

<li> 
    <div ng-click="vm.navigateTo(1)"> 
     <label translate="{{vm.translationKeys[1]}}" ng-class="{'hasRequests': vm.programHasRequests == false && vm.currentStepNumber != 1}"></label> 
    </div> 
</li> 

<li> 
    <div ng-click="vm.navigateTo(2)"> 
     <label translate="{{vm.translationKeys[2]}}" ng-class="{'hasRequests': vm.hasRequestIdInUrl == false}"></label> 
    </div> 
</li> 

<li id="last"> 
    <div ng-click="vm.navigateTo(3)"> 
     <label translate="{{vm.translationKeys[3]}}" ng-class="{'hasRequests': vm.hasRequestIdInUrl == false}"></label> 
    </div> 
</li> 

Есть ли способ, чтобы получить нг-инвалидов, работающих на элементы списка, потому что теперь я все еще могу нажать на элементы списка даже когда применяется ng-класс.

Спасибо за помощь,

Привет, Брент

ответ

1

Вы не можете отключить элемент списка. Вы отключите элемент списка путем изменения цвета с помощью CSS. Точно так же вы можете справиться с этим на javascript. Убедитесь, что он отключен или нет. Затем сделайте поток.

<li> 
    <div ng-click="vm.navigateTo(1,vm.translationKeys)"> 
     <label translate="{{vm.translationKeys[1]}}" ng-class="vm.programHasRequests == false ? 'Redirect':'NotRedirect'"></label> 
    </div> 
</li> 

В функции «navigateTo» вам необходимо проверить, не перенаправлен ли второй параметр.