我正在使用以下 ui-router 配置。因此，当用户单击选项卡时，该选项卡会按预期正确突出显示。但是，当页面首次加载时，不会突出显示任何选项卡，并且用户必须单击选项卡才能激活其状态。我希望页面首次加载时主页状态成为事件选项卡。我怎样才能实现这个目标？
angular.module("app", ['app.home', 'app.page1', 'app.page2', 'app.page3'])
.config(function($stateProvider, $urlRouterProvider) {
$urlRouterProvider.otherwise('home');
$stateProvider
.state('home', {
url: '/',
views: {
'MainContentPlaceHolder': {
templateUrl: '../Home/_Layout.html'
}
}
})
.state('page1', {
url: '/page1',
views: {
'MainContentPlaceHolder': {
templateUrl: '../Page-1/_Layout.html'
}
}
})
.state('page2', {
url: '/page2',
views: {
'MainContentPlaceHolder': {
templateUrl: '../Page-2/_Layout.html'
}
}
})
.state('page3', {
url: '/page3',
views: {
'MainContentPlaceHolder': {
templateUrl: '../Page-3/_Layout.html'
}
}
});
})
我的 HTML 标记是:
<body>
<section id="NavBar">
<nav class="navbar navbar-inverse navbar-static-top">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" ui-sref="home"><span class="glyphicon glyphicon-home" aria-hidden="true"></span></a>
</div>
<ul class="nav navbar-nav">
<li ui-sref-active="active"><a ui-sref="home">Home</a></li>
<li ui-sref-active="active"><a ui-sref="page1">Page 1</a></li>
<li ui-sref-active="active"><a ui-sref="page2">Page 2</a></li>
<li ui-sref-active="active"><a ui-sref="page3">Page 3</a></li>
</ul>
</div>
</nav>
</section>
<section id="ContentPlaceHolder" ui-view="MainContentPlaceHolder"></section>
</body>
最佳答案
好吧，我设法解决了这个问题。这是第三行的语法错误，应该从
更改$urlRouterProvider.otherwise('home');
到
$urlRouterProvider.otherwise('/');
我原以为 $urlRouter.otherwise() 将状态作为参数。它实际上应该是重定向网址。
关于javascript - 如何激活 Angular ui-sref 的页面加载状态？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38835668/