angularjs 1.6.0 (latest now) routes not working


I was expecting to see this question on Stackoverflow but didn’t. Apparently I’m the only one having this problem that seems to me to be very common.

I have a basic project I am working on but the routes don’t seem to work even though everything I’ve done so far seems to be right.

I have this piece of html in my index.html file:

<head ng-app="myApp"> 
    <title>New project</title>
    <script src=""></script>
    <script src=""></script>

    <script src="app.js"></script>
    <a href="#/add-quote">Add Quote</a>
    <div ng-view ></div>

and here is my app.js:

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

app.config(['$routeProvider', function ($routeProvider) {
        .when('/add-quote', {
            templateUrl: 'views/add_quote.html',
            controller: 'QuoteCtrl'
        .otherwise({ redirectTo: '/' });

Now when I just visit the page, here is what I get in the url:


and when I click on the Add quote button, I get this:


What can be the problem here?
Thanks for help


Simply use hashbang #! in the href:

 <a href="#!/add-quote">Add Quote</a>

Due to aa077e8, the default hash-prefix used for $location hash-bang URLs has changed from the empty string ('') to the bang ('!').

If you actually want to have no hash-prefix, then you can restore the previous behavior by adding a configuration block to your application:

appModule.config(['$locationProvider', function($locationProvider) {

For more information, see

Sorry to get on my high horse but… How did this get released? This is massive, breaking bug. — @MiloTheGreat

The breaking change as by #14202 should be reverted as the reference specification was already officially deprecated #15715

I’m going to close this issue because we haven’t got any feedback. Feel free to reopen this issue if you can provide new feedback.

Answered By – georgeawg

Answer Checked By – Willingham (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.