I never had this problem before and I know this is a tiny issue... but I can't seem to figure out what is wrong... 1 of my partials is not loading correctly and instead it hits the otherwise route back to my /login (which I have assigned). Every time I click on the Create a survey link it redirects me back to the login and the URL displays this http://localhost:3000/#!/login#%2Fcreate but when I put http://localhost:3000/#!/create in the URL it works. Not quite sure what the problem is. Please HELP!
var app = angular.module('myApp', ['ngRoute']);
app.config(function($routeProvider){
$routeProvider
.when('/login', {
templateUrl: 'partials/login.html',
controller: 'UserController'
})
.when('/dashboard', {
templateUrl: 'partials/dashboard.html',
controller: 'SurveyController'
})
.when('/create', {
templateUrl: 'partials/create.html',
controller: 'SurveyController'
})
.when('/poll/:id', {
templateUrl: 'partials/poll.html'
})
.otherwise({
redirectTo: '/login'
});
})
<!DOCTYPE html>
<html>
<head>
<title>Survey Polls</title>
<!-- CSS -->
<link rel="stylesheet" href="bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="styles.css">
<!-- Angular -->
<script src="angular/angular.js"></script>
<script src="angular-route/angular-route.js"></script>
<!-- jQuery/Bootstrap -->
<script src="jquery/dist/jquery.js"></script>
<script src="bootstrap/dist/js/bootstrap.js"></script>
<!-- App.js -->
<script src="app.js"></script>
<!-- Controllers/Factories -->
<script src="controllers/SurveyController.js"></script>
<script src="controllers/UserController.js"></script>
<script src="factories/SurveyFactory.js"></script>
<script src="factories/UserFactory.js"></script>
</head>
<body ng-app="myApp">
<div class="container">
<div ng-view></div>
</div>
</body>
</html>
<a href="#/create">Create a new survey</a>
<h3>Current polls:</h3>
<table border="1">
<thead>
<tr>
<th>Name</th>
<th>Survey Question</th>
<th>Date Posted</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="s in surveys">
<td>{{ s._user.username }}</td>
<td>{{ s.question }}</td>
<td>{{ s.created_at }}</td>
<td><button ng-show="loggedInUser._id == s._user._id" ng-click="delete(s._id)">Delete</button></td>
</tr>
</tbody>
</table>
I found a possible solution here. Add this line to your config to get rid of the exclamation point (!):