问题描述
有一个角度应用程序,如果主视图是主页视图,我想隐藏其中一个包含的视图".
<header id="pageHeader" ng-controller="HeaderCtrl" data-ng-include="'views/includes/header.html'"></header><div id="pageHero" ng-show='$rootScope.fullView' ng-controller="MainsearchCtrl" data-ng-include="'views/mainSearch.html'"></div><div id="pageContent" ng-view=""></div>
您可以将 $route
或 $location
注入您的控制器,从其中之一获取所需的值这些服务并在 ng-show
或 ng-if
中使用.
使用 $route
和 $location
的例子你可以看到 此处.
这是一种可行的方法:
JavaScript
angular.module('app', ['ngRoute']).配置(['$routeProvider',函数($routeProvider){$routeProvider.当('/一个',{控制器:'路由控制器',templateUrl: 'routeTemplate.html'}).当('/两个',{控制器:'路由控制器',templateUrl: 'routeTemplate.html'}).除此以外({重定向到:'/一个'})}]).控制器('routeController', ['$scope', '$location', function($scope, $location) {$scope.showPageHero = $location.path() === '/one';}]);
routeTemplate.html
<h1>路由模板</h1><div ng-include="'hero.html'" ng-if="showPageHero"></div><div ng-include="'content.html'"></div>
Plunker:http://plnkr.co/edit/sZlZaz3LQILJcCywB1EB?p=preview
have an angular application that I want to hide one of the 'included views' if the main view is the homepage view.
<div id="page" ng-class="{ showNav: $root.showNav }">
<header id="pageHeader" ng-controller="HeaderCtrl" data-ng-include="'views/includes/header.html'"></header>
<div id="pageHero" ng-show='$rootScope.fullView' ng-controller="MainsearchCtrl" data-ng-include="'views/mainSearch.html'"></div>
<div id="pageContent" ng-view=""></div>
</div>
You can inject either $route
or $location
into your controller, fetch needed value from one of these services and use it in ng-show
or ng-if
.
Example of using $route
and $location
you can see here.
Here is one of possible ways of doing it:
JavaScript
angular.module('app', ['ngRoute']).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/one', {
controller: 'routeController',
templateUrl: 'routeTemplate.html'
}).
when('/two', {
controller: 'routeController',
templateUrl: 'routeTemplate.html'
}).
otherwise({
redirectTo: '/one'
})
}]).
controller('routeController', ['$scope', '$location', function($scope, $location) {
$scope.showPageHero = $location.path() === '/one';
}]);
routeTemplate.html
<div>
<h1>Route Template</h1>
<div ng-include="'hero.html'" ng-if="showPageHero"></div>
<div ng-include="'content.html'"></div>
</div>
Plunker: http://plnkr.co/edit/sZlZaz3LQILJcCywB1EB?p=preview
这篇关于如何根据我当前所在的页面/路线使用 angular ng-hide?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!