AngularJS Routing: Using Otherwise without redirectTo (or how to make a 404 page)

Every example I see of the otherwise statement in the built in AngularJS routing configuration looks like this.

var app = angular.module(‘myApp’, [‘ngRoute’]);

app.config(function ($routeProvider) {
$routeProvider
.when(‘/‘, {
controller: ‘HomeController’,
templateUrl: ‘Views/home.html’
})
//other whens removed
.otherwise({ redirectTo: ‘/‘ });
});

That’s nice, but what if I want to have a 404 page? At this moment the angular docs don’t give much of a hint to what is possible.

I really wanted a default page that let the user know something went wrong instead of just sending them to the home page.  This turns out to be quite easy.  The example below loads it own Controller and View when no match is found.

var app = angular.module('myApp', ['ngRoute']);

app.config(function ($routeProvider) {
    $routeProvider
    .when('/', {
        controller: 'HomeController',
        templateUrl: 'Views/home.html'
    })
    //other whens removed
    .otherwise({
        controller: 'Error404Controller',
        templateUrl: 'Views/Error404.html'
    });
});

I suspect all the options for the $routeProvider work but these are all I have confirmation for.  Also, I am sure someone is thinking “this is not a real 404 page since the response code is not a 404.”  That’s ok with me.  I am still going to think of it as “Page Not Found”.