Angular.js: ng-当$state.current.name为某个值时显示元素
Angular.js: ng-当$state.current.name为某个值时显示元素
提问于 2014-03-31 03:06:00
我希望仅当$state.current.name等于about.list时才显示一块HTML.到目前为止，我有以下代码，但它似乎没有根据状态切换元素。
index.html
<nav class="global-navigation">
<ul class="list">
<li class="list-item">
<a class="list-item-link" ui-sref="home">
Home
</a>
</li>
<li class="list-item">
<a class="list-item-link" ui-sref="about">
About
</a>
</li>
<li class="list-item" ng-show="$state.current.name == 'about.list'">
<a class="list-item-link" ui-sref="about.list">
List
</a>
</li>
</ul>
</nav>app.js
var myApp = angular.module('myApp', ['ui.router'])
.config(['$urlRouterProvider', '$stateProvider',
function($urlRouterProvider, $stateProvider) {
$urlRouterProvider.otherwise('/404.html');
$stateProvider.
// Home
state('home', {
url: '/',
templateUrl: 'partials/_home.html',
controller: 'homeCtrl'
}).
// About
state('about', {
url: '/about',
templateUrl: 'partials/_about.html',
controller: 'aboutCtrl'
}).
// About List
state('about.list', {
url: '/list',
controller: 'aboutCtrl',
templateUrl: 'partials/_about.list.html',
views: {
'list': { templateUrl: 'partials/_about.list.html' }
}
});
}]
);回答 3
Stack Overflow用户
回答已采纳
发布于 2014-03-31 03:24:25
或
JS
.run(function ($state,$rootScope) {
$rootScope.$state = $state;
})HTML
data-ng-show="$state.includes('about.list')"Stack Overflow用户
发布于 2016-03-16 23:31:10
您可以使用像isState或includedByState这样的过滤器。
ng-if="'about.list' | isState" // exactly 'about.list'
ng-if="'about' | includedByState" // works for about and its children about.*Stack Overflow用户
发布于 2014-03-31 03:15:07
视图(html)不知道变量$state。它只知道与视图相关联的$scope。
您可以在与此视图关联的控制器内的$scope上公开$state变量(您可能还需要将$state注入到控制器中)：
$scope.uiRouterState = $state;然后稍微更改一下标记中的表达式：
<li class="list-item" ng-show="uiRouterState.current.name == 'about.list'">页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/22748456
复制相关文章
相似问题