AngularJS - Why when changing url address $routeProvider doesn't seem to work and I get a 404 error
angularjs, apache
Solution
You need to setup your apache to redirect all paths to root.
When you directly open `http://localhost/teach/overview` your web server is trying to serve a page from a route that is not defined.
When, within an angular app, you click on a link with href path of `http://localhost/teach/overview`, Angular steps in, and instead of letting your browser request a page from the server it intercepts your click event and goes to your routeProvider to see which client-side view to display (this is why they call it "single-page apps"). That's why your links work as long as you try not to open them directly.
Beside the apache config you might also want to use `base` tag with href value of `/teach/`:
<base href="/teach/" />
so that you can have your routeProvider not constrained by fixed prefix:
teachApp.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider.
when('/', {templateUrl: 'views/login_view.html'}).
when('/overview', {templateUrl: 'views/overview_view.html'}).
when('/users', {templateUrl: 'views/users_view.html'}).
otherwise({redirectTo: '/'});
$locationProvider.html5Mode(true);
}]);
Problem
My `$routeProvider` is configured like this: ``` teachApp.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { $routeProvider. when('/teach/', {templateUrl: 'views/login_view.html'}). when('/teach/overview', {templateUrl: 'views/overview_view.html'}). when('/teach/users', {templateUrl: 'views/users_view.html'}). otherwise({redirectTo: '/teach/'}); $locationProvider.html5Mode(true); }]); ``` Within the app, if I click on a link such as `<a href="/teach/overview">Overview</a>`, the overview partial shows as expected. However, when I manually change the URL in the address bar to exactly the same URL, I get a 404 error. Is `$routeProvider` incorrectly configured? I'm using MAMP localhost with the root url of the app being `http://localhost/teach/`