2016-11-30 67 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-殘疾人工作,因爲現在我仍然可以在列表項單擊連當應用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'函數中,您需要檢查第二個參數是否重定向。