My routing configuration appears as follows (for readability, I've omitted the second parameter in when()):
app.config(function($routeProvider, $locationProvider){
// Prepare for html5 mode
$locationProvider.hashPrefix('!');
$locationProvider.html5Mode(true);
// Setup routing
$routeProvider.when('/dashboard/main', {
}).when('/dashboard/website/:id/clicks', {
}).when('/dashboard/website/:id/uploads', {
}).when('/dashboard/website/:id/forms', {
}).when('/dashboard/website/:id', {
}).otherwise({
redirectTo: '/dashboard/main'
});
});
Subsequently, I have navigation links that I wish to disable when :id is absent.
<ul class="nav nav-pills nav-stacked">
<!-- always active -->
<li>
<a href="/dashboard/main"><i class="glyphicon glyphicon-home"></i> Home</a>
</li>
<!-- active only if :id is set -->
<li>
<a href="/dashboard/clicks"><i class="glyphicon glyphicon-hand-up"></i> Clicks</a>
</li>
...
</ul>
Is there a way to automatically enable the second navigation item when :id is included, and disable it when :id is not present?