I'm creating my first single page app using Angular 1 (v1.6.0), utilizing ng-hide
and ng-show
to hide or show different header elements (my homepage has a parallaxed hero image in the header - my other pages do not).
For my controller, routeController
, I was only able to assign one $location.path()
per $rootScope.showPortfolioHeader
:
app.controller('routeController', ['$rootScope', '$location', function($rootScope, $location) {
$rootScope.showPortfolioHeader = $location.path() === '/jcRealty';
}]);
I tried two ways to assign multiple paths to the same $rootScope.showPortfolioHeader
boolean, which both failed:
Try # 1
app.controller('routeController', ['$rootScope', '$location', function($rootScope, $location) {
$rootScope.showPortfolioHeader = $location.path() === ('/jcRealty' || '/randomQuoteGenerator');
}]);
Try # 2
app.controller('routeController', ['$rootScope', '$location', function($rootScope, $location) {
$rootScope.showPortfolioHeader = $location.path() === '/jcRealty';
}]);
app.controller('routeController', ['$rootScope', '$location', function($rootScope, $location) {
$rootScope.showPortfolioHeader = $location.path() === '/randomQuoteGenerator';
}]);
Both of these attempts resulted in the boolean being applied to only one of the $location.path()
's. I then realized that in this case, I could accomplish what I want with:
app.controller('routeController', ['$rootScope', '$location', function($rootScope, $location) {
$rootScope.showPortfolioHeader = $location.path() !== '/';
}]);
which applies $rootscope.showPortfolioHeader
to any path that isn't the home page. But I'd still like to know how to accomplish this without the !==
, in case I had three distinct headers, etc etc.