I have a web application dashboard with a common header across all HTML files, including the profile page, page 1, and SignIn. However, I want the SignIn page to be different without the common header. How can I redirect to signin.html without using ng-view or the common header?
var app=angular.module('single-page-app',['ngRoute']);
app.config(function($routeProvider,$locationProvider){
//HTML5 Location # remove
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
$routeProvider
.when('/profile',{
templateUrl: 'profile.html',
controller:'profilecntrl'
})
.when('/page1',{
templateUrl: 'page1.html',
controller:'singlecntrl'
}).
when('/signIn',{
templateUrl:'signIn.html'
});
});
app.controller('MainController',function($scope){
});
My main Header file HTML is as follows:
<!-- HEADER AND NAVBAR -->
<header>
<nav class="navbar navbar-default">
<div class="container">
<div class="navbar-header">
<a class="navbar-brand" href="/">Angular Routing</a>
</div>
<ul class="nav navbar-nav navbar-right">
<li><a href="/profile">Profile</a></li>
<li><a href="/page1">Page 1</a></li>
<li><a href="/signIn">Sign In</a></li>
</ul>
</div>
</nav>
</header>
<!-- MAIN CONTENT AND INJECTED VIEWS -->
<div ng-view=""></div>
In a separate Sign In HTML file where ng-view and the Header are not included, you can still redirect to signIn.html using ng-Route.