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.
Réponses:
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/