angularjs用户界面路由器-当特定的子路由被击中时，我如何隐藏子菜单？
angularjs用户界面路由器-当特定的子路由被击中时，我如何隐藏子菜单？
提问于 2017-04-02 09:36:35
我正在编写一个AngularJS /Ui路由器示例，其中有以下内容：
带有子状态音乐的州新闻，当单击音乐时，新闻活动状态被维护，因为我有news.music (音乐是新闻的子状态)。
然而，体育状态并不是新闻的一个子状态.当我点击运动时，如何保持新闻活动状态(蓝色背景)？
我见过很多相关的职位，但它们都太老了。
下面是代码的快照：
app.config(function($stateProvider){
$stateProvider.state('news', {
url: '/news',
templateUrl : 'news.html'
})
});
app.config(function($stateProvider){
$stateProvider.state('sports', {
url: '/sports',
templateUrl : 'sports.html'
})
});
app.config(function($stateProvider){
$stateProvider.state('news.music', {
url: '/music',
templateUrl : 'music.html'
})
});index.html
<ul class="nav nav-pills">
<li role="presentation" ui-sref-active="active"><a ui-sref="news">News</a></li>
<li role="presentation" ui-sref-active="active"><a ui-sref="about">About</a></li>
</ul>
<ui-view></ui-view>news.html
<ul class="nav nav-tabs">
<li role="presentation" ui-sref-active="active"><a ui-sref="sports">Sports</a></li>
<li role="presentation" ui-sref-active="active"><a ui-sref="news.music">Music</a></li>
</ul>
<ui-view></ui-view>和正在运行的柱塞
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-04-02 09:58:52
虽然这仍然是应用程序设计中的一个错误，但是您可以通过让news.sports作为news的子路由来实现，就像在这个可运行的plnkr演示中那样。您的问题应该是：“当特定的子路径被击中时，我如何隐藏子菜单”。
视图
<ul class="nav nav-tabs" ng-controller="submenuController" ng-show="showSubMenu">
<li role="presentation" ui-sref-active="active"><a ui-sref="news.sports">Sports</a></li>
<li role="presentation" ui-sref-active="active"><a ui-sref="news.music">Music</a></li>
</ul>
<ui-view></ui-view>控制器
app.controller('submenuController', function ($scope, $rootScope, $state) {
$scope.showSubMenu = true;
$scope.$watch(function(){
return $state.$current.name
}, function(currentStateName){
$scope.showSubMenu = currentStateName === 'news.sports' ? false : true;
})
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/43166826
复制相关文章
相似问题
腾讯云开发者
