Пользовательский интерфейс AngularJs активировал домашнюю страницу
Я работаю с приложением AngularJs v 1 с пользовательским интерфейсом маршрутизации.
Мой вопрос просто, как активировать домашнюю страницу, не нажимая на ссылку ui-sref.
Я пытался с ng-class="active", но это не решает задачу.
<script>
angular.module("myApp",['ui.router'])
.config(function ($stateProvider,$urlRouterProvider,$locationProvider) {
$stateProvider
.state("home",{
url:"home",
views:{
'main':{templateUrl:"home.html"}
}
});
$locationProvider.hashPrefix('');
$urlRouterProvider.otherwise("/home");
</script>
<div class="container" style="margin-top: 60px">
<div ui-view="main"> </div>
</div>
Главная страница
<div class="row" style=" margin-top:100px; " ng-app="app" ng-class="active">
<h1>Home</h1>
</div>
1 ответ
То, что вы ищете, это ui-sref-active
Из документа
Директива, работающая вместе с ui-sref для добавления классов к элементу, когда состояние связанной директивы ui-sref активно, и удаление их, когда оно неактивно. Основной вариант использования - упростить особый внешний вид навигационных меню, опираясь на ui-sref, так как кнопка меню "активного" состояния выглядит по-другому, что отличает ее от неактивных пунктов меню.
Это добавит active
для вас, если вы находитесь в правильном состоянии.
Разметка должна выглядеть примерно так:
<div class="some-navigation-class">
<a ui-sref="home" ui-sref-active="active">Home</a>
<!-- more nav goes here -->
</div>