How to hide elements from Angular layout.html on some pages
So I am using ui-router and index.html as my layout, inside of them I have this div which will add other pages like:
I have this HTML which is my layout.html:
<html ng-app="myApp">
<head>
<title> My layout.html </title>
</head>
<body>
<nav>
I have this NAVBAR
</nav>
<div ui-view></div>
</body>
</html>
So if I access the "posts" pages Angular will add the code inside posts.html to <div ui-view></div>
Nothing out of the ordinary, right?
The question is, I have a 404.html template file that I don't want to show in the navigation bar. Is it possible to uncheck or hide the navbar if the page is 404.html?
+3
user4002542
source
to share
1 answer
I would create a controller for the navigation section.
.controller('NavCtrl', function($scope, $state) {
$scope.$state = $state;
})
Then hide the navigation when the current state is 404:
<nav ng-controller="NavCtrl" ng-hide="$state.current.name == '404'">
I have this NAVBAR
</nav>
+3
source to share