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

Je suis en utilisant AngularUI de routage et je voudrais faire un ng-class="{active: current.state}" mais je n'en suis pas sûr comment exactement détecter l'état actuel dans une directive de ce genre.

InformationsquelleAutor Webnet | 2013-06-20
  1. 115

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

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

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

    InformationsquelleAutor darthwade
  2. 147

    Mise à jour:

    Cette réponse était pour beaucoup plus ancienne version de l'Interface utilisateur du Routeur. Pour les versions plus récentes (0.2.5+), veuillez utiliser le helper directive ui-sref-active. Détails ici.

    Réponse Originale À Cette Question:

    Inclure le $service de l'état dans votre contrôleur. Vous pouvez affecter ce service à une propriété sur votre périmètre.

    Un exemple:

    $scope.$state = $state;

    Puis obtenir l'état actuel de vos modèles:

    $state.current.name

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

    $state.includes('stateName');

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

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

    ng-class="{active: $state.includes('stateName')}"
    InformationsquelleAutor Cuong Vo
  3. 25

    Si vous utilisez l'interface utilisateur du routeur, essayez $état.est();

    Vous pouvez l'utiliser comme ceci:

    $state.is('stateName');

    Par la documentation:

    $état.est ... semblable à $état.comprend, mais vérifie seulement pour le plein nom de l'état.

    InformationsquelleAutor Clement Hoang
  4. 1

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

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

    comme l'a constaté ici sous le commentaire intitulé "tgrant59 a commenté le 31 Mai 2016".

    Je suis en utilisant angular-ui-router v0.3.1.

    InformationsquelleAutor jaycer
  5. 0

    Découvrez angulaire de l'interface utilisateur, plus précisément, sur la route de la vérification:
    http://angular-ui.github.io/ui-utils/

    • Je suis en train de vérifier l'état actuel, pas nécessairement de la route
    InformationsquelleAutor John Tseng