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.
la source
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:
la source
L'utilisation de la directive ui-sref-active qui a fonctionné pour moi était:
comme trouvé ici sous le commentaire intitulé "tgrant59 a commenté le 31 mai 2016".
J'utilise angular-ui-router v0.3.1.
la source
Découvrez angular-ui, en particulier, la vérification d'itinéraire: http://angular-ui.github.io/ui-utils/
la source