Я использую маршрутизацию AngularUI, и я хотел бы сделать, ng-class="{active: current.state}"
но я не уверен, как точно определить текущее состояние в такой директиве.
источник
Я использую маршрутизацию AngularUI, и я хотел бы сделать, ng-class="{active: current.state}"
но я не уверен, как точно определить текущее состояние в такой директиве.
Также вы можете использовать директиву ui-sref-active :
<ul>
<li ui-sref-active="active" class="item">
<a href ui-sref="app.user({user: 'bilbobaggins'})">@bilbobaggins</a>
</li>
<!-- ... -->
</ul>
Или фильтры:
"stateName" | isState
&"stateName" | includedByState
Обновить:
Этот ответ был для более ранней версии Ui-Router. Для более поздних выпусков (0.2.5+) используйте вспомогательную директиву ui-sref-active
. Подробности здесь .
Оригинальный ответ:
Включите службу $ state в свой контроллер. Вы можете назначить эту услугу свойству в вашей области.
Пример:
$scope.$state = $state;
Затем, чтобы получить текущее состояние в ваших шаблонах:
$state.current.name
Чтобы проверить, активно ли состояние в данный момент:
$state.includes('stateName');
Этот метод возвращает истину, если состояние включено, даже если оно является частью вложенного состояния. Если бы вы были во вложенном состоянии, user.details
и вы проверили $state.includes('user')
, он вернет true.
В примере с классом вы бы сделали что-то вроде этого:
ng-class="{active: $state.includes('stateName')}"
Если вы используете ui-router, попробуйте $ state.is ();
Вы можете использовать это так:
$state.is('stateName');
Согласно документации:
источник
У меня сработала директива ui-sref-active :
как показано здесь, под комментарием "tgrant59 прокомментировал 31 мая 2016 г.".
Я использую angular-ui-router v0.3.1.
источник
Ознакомьтесь с angular-ui, в частности, с проверкой маршрута: http://angular-ui.github.io/ui-utils/
источник