404 error when using routing with Angular.js


I'm trying to set up routing with angular and angularfire but am having trouble.

var app = angular.module('sampleApp', ['ngRoute', 'firebase', 'ui.bootstrap']);

app.config(function ($routeProvider) {
      .when('/', {
        templateUrl: 'index.html',
        controller: 'SampleCtrl'
      .when('/login', {
        templateUrl: 'views/login.html',
        controller: 'LoginCtrl'
        redirectTo: '/'


app.controller('LoginCtrl', function($scope, $firebase){

when I try to hit localhost:8000/login I get the following error message

Error code explanation: 404 = Nothing matches the given URI.

How can I set up simple routes with ngRoute and AngularFire?

When using the default router you need to use a hash in the url.


If you want to remove the hash, that's another story.

You'll need to use the $locationProvider and set html5Mode() to true. From there you'll have to stop using $window.location.href to change routes and use $location.path().

Then you'll have to get a server or use a service like Firebase Hosting that supports URL rewrites.