angular js index.html to home redirect
Question
I am developing a website, when I am typing the url it is directing to index.html even though I used route providers to navigate to home , what am I suppose tot do I have attached my code below,Please got through that and let me know what I need to change, when I called the website address it directly redirects to www.xxyy.com\\home
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-route.min.js"></script>
<link rel="stylesheet" type="text/css" href="xploresoftware.css">
<script type="text/javascript" src="angularview.js"></script>
<script type="text/javascript" src="addressingtabs.js"></script>
</head>
<body ng-app="myapp">
<nav role="navigation" class="navbar navbar-default navbar-fixed-top" id="navbar">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#/home" class="navbar-brand" id="logo"><img src="Images/Drawing.png"></a>
</div>
<!-- Collection of nav links and other content for toggling -->
<div id="navbarCollapse" class="collapse navbar-collapse">
<ul class="nav navbar-nav" id="subject">
<li><a href="#/ece">Electrical Engineering</a></li>
<li><a href="#/cs"> Computer Science</a></li>
<li><a href="#/mech"> Mechanical Engineering</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Login</a></li>
</ul>
</div>
</div>
</nav>
<div class="container-fluid" style="margin-top:55px " >
<div ng-view></div>
</div>
</div>
</div>
</body>
</html>
Below is the route provider code:
(function(){
var app=angular.module('myapp',['ngRoute']);
app.config(['$logProvider','$routeProvider',function($logProvider,$routeProvider){
$locationProvider.hashPrefix();
$logProvider.debugEnabled(true);
$routeProvider
.when('/home',{
templateUrl:home.html,
});
.when('/ece',{
templateUrl:ece.html,
});
.when('/cs',{
templateUrl:cs.html,
});
.when('/mech',{
templateUrl:mech.html,
});[question1][1]
.otherwise({
redirectTo:'/home',
})
}]);
}());
2 answers
solution1
0 2015-12-21 04:44:06
If I understand correctly, you want to land on the home.html as the home page, not the index.html . In that case, you should add one more routing like this -
.when('/',{
templateUrl:home.html,
});
Edit : I think your code is also syntactically incorrect. See the corrected one -
$routeProvider
.when('/home',{
templateUrl:home.html
})
.when('/ece',{
templateUrl:ece.html
})
.when('/cs',{
templateUrl:cs.html
})
.when('/mech',{
templateUrl:mech.html
})
.otherwise({
redirectTo:'/home'
});
solution2
0 2015-12-21 05:57:10
You have a lot of issues in your code and pieces that I don't know where they come from, but, some issues are mainly with the javascript code in the way you define your routes, so for example you are using "." while the line before that "." was ended with semicolon, also, the names of your html files are not strings !.
$routeProvider
.when('/home',{
templateUrl:"home.html"
}).when('/ece',{
templateUrl:ece.html
})
Now, This plnkr
has a working demo based on the code that you provided. you can have a look and use it as a base line to fix your existing code.
Hope this help.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.