Comment détecter l'état actuel dans la directive

J'utilise le routage d'AngularUI et j'aimerais faire un ng-class="{active: current.state}"mais je ne sais pas comment détecter exactement l'état actuel dans une directive comme celle-ci.

Vous pouvez également utiliser la directive ui-sref-active :

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

Ou filtres: "stateName" | isState&"stateName" | includedByState

Mise à jour:

Cette réponse concernait une version beaucoup plus ancienne d'Ui-Router. Pour les versions les plus récentes (0.2.5+), veuillez utiliser la directive helper ui-sref-active. Détails ici .

Réponse originale:

Incluez le service $ state dans votre contrôleur. Vous pouvez attribuer ce service à une propriété de votre étendue.

Un exemple:

$scope.$state = $state;

Ensuite, pour obtenir l'état actuel de vos modèles:

$state.current.name

Pour vérifier si un état est actuellement actif:

$state.includes('stateName'); 

Cette méthode renvoie true si l'état est inclus, même s'il fait partie d'un état imbriqué. Si vous étiez dans un état imbriqué user.details, et que vous avez vérifié $state.includes('user'), il renverrait true.

Dans votre exemple de classe, vous feriez quelque chose comme ceci:

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

Si vous utilisez ui-router, essayez $ state.is ();

Vous pouvez l'utiliser comme ceci:

$state.is('stateName');

Selon la documentation:

$ state.is ... similaire à $ state.includes, mais ne vérifie que le nom complet de l'état.

L'utilisation de la directive ui-sref-active qui a fonctionné pour moi était:

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

comme trouvé ici sous le commentaire intitulé "tgrant59 a commenté le 31 mai 2016".

J'utilise angular-ui-router v0.3.1.

Découvrez angular-ui, en particulier, la vérification d'itinéraire: http://angular-ui.github.io/ui-utils/