リストアイテムを無効にする - angularjs

Question

私はAngularJSでパンくずリストナビゲーションを作成しています。 ユーザーが要件を満たしていないため、一部のリンクを無効にする必要があります。

私は角度のあるドキュメントを調べましたが、リストアイテムにng-disabledを使用できないことがわかりました。だから私は、リストアイテムをグレーアウトするためにng-classを使用しています。今私はまだでもリストの項目をクリックすることができますので、リストの項目でNG-無効に作業を取得する方法はあり

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

：ここに は、私は、現時点で使用していますHTMLコードですng-classが適用されたとき。助けるため

おかげで、

挨拶、ブレント

Answer 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'関数では、2番目のパラメータでリダイレクトするかどうかを確認する必要があります。