Come rilevare lo stato corrente all'interno della direttiva

Question

Uso il routing di AngularUI e mi piacerebbe fare uno ng-class="{active: current.state}" ma non sono sicuro di come rilevare esattamente lo stato corrente in una direttiva come questa.

Answer 1

Inoltre è possibile utilizzare ui-sref-attiva direttiva:

<ul> 
    <li ui-sref-active="active" class="item"> 
    <a href ui-sref="app.user({user: 'bilbobaggins'})">@bilbobaggins</a> 
    </li> 
    <!-- ... --> 
</ul> 

o filtri: "stateName" | isState & "stateName" | includedByState

Answer 2

Partenza angolare-ui, in particolare, itinerario controllo: http://angular-ui.github.io/ui-utils/

Answer 3

Aggiornamento:

Questa risposta è stata per un rilascio molto più vecchio di Ui-Router. Per le versioni più recenti (0.2.5+), utilizzare la direttiva helper ui-sref-active. Dettagli here.

---

risposta originale:

Calcola il servizio di stato $ nel controller. È possibile assegnare questo servizio a una proprietà nel proprio ambito.

Un esempio:

$scope.$state = $state; 

Quindi per ottenere lo stato attuale nei template:

$state.current.name 

Per verificare se uno Stato è corrente attiva:

$state.includes('stateName'); 

questo metodo restituisce true se lo stato è incluso, anche se fa parte di uno stato nidificato. Se si era in uno stato di nidificazione, user.details, e si è verificato per $state.includes('user'), restituirebbe true.

Nel tuo esempio di classe, si farebbe qualcosa di simile:

ng-class="{active: $state.includes('stateName')}" 

Answer 4

Se si utilizza ui-router, provare $ state.is();

Si può usare in questo modo:

$state.is('stateName');

Documentation

Answer 5

L'uso di direttiva ui-sref-attiva che ha funzionato per me è stato:

<li ui-sref-active="{'active': 'admin'}"> 
    <a ui-sref="admin.users">Administration Panel</a> 
</li> 

come trovato here sotto il commento etichettato "tgrant59 ha commentato il 31 maggio 2016".

Sto usando angular-ui-router v0.3.1.