When I access http://localhost:9000 in my browser, the content of the index.html page loads fine, but the ng-view section remains empty even though it is linked to my controller/view at '/'.
Initially, Angular does not append /#/ to the URL and $location.path() returns an empty string. Clicking on any link, such as the about page, causes Angular to add /#/about to the URL and the page displays correctly. However, if the page is reloaded for any reason (like hitting refresh or live-reload updates), the /#/about stays in the URL but ng-view shows up as blank.
This is how my configuration looks:
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl'
})
.when('/about', {
templateUrl: 'views/about.html',
controller: 'AboutCtrl'
})
.otherwise({
redirectTo: '/'
});
})
I have added ngRoute to the app and made sure the script is included in the index file.
Previously, this app was functioning perfectly. I tried using $locationProvider.html5Mode() briefly but reverted back to the original settings with a git reset. Ever since then, the app has failed to work properly on any machine or browser.
I am unsure of what could be causing this issue or what steps are needed to resolve it. I am open to trying any suggestions that may help fix the problem.
EDIT: StackOverflow seems to have cut off part of my title. Oh well.