2

Learning some Angular - and I'm stuck on routing

Here is my angular config

var meanApp = angular.module('carz', ['ngRoute']);


meanApp.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'home.html',
            controller: 'mainCtrl'
        })
        .when('/red', {
            templateUrl: 'red.html',
            controller: 'redCtrl'
        });
});

Here is are my links

<a href="#">Home</a>
<a href="#red">Red</a>

When I load up my node app I am directed to 

http://localhost:8080/#!/

And I get my angular controller working as expected within the ng-view tags

But I cannot switch from one controller to the other using the links above.

If I select the red tag my URL adds an extra # becoming

http://localhost:8080/#!/#red

Note if I manually change to 

http://localhost:8080/#!/red

My controller changes and it works so why am I getting the extra #

Thanks for any help

Mistalis
  • 17,793
  • 13
  • 73
  • 97
DogCoffee
  • 19,820
  • 10
  • 87
  • 120
  • 1
    This question can be helpful for you, Thanks. http://stackoverflow.com/questions/14771091/removing-the-fragment-identifier-from-angularjs-urls-symbol – Arpit Kumar Dec 26 '16 at 09:14
  • Red. It should work – Ved Dec 26 '16 at 09:34
  • @ArpitMeena I tried that prior to posting the question and it didn't solve the problem. – DogCoffee Dec 26 '16 at 10:41
  • Possible duplicate of [URL hash-bang (#!/) prefix instead of simple hash (#/)](http://stackoverflow.com/questions/41226122/url-hash-bang-prefix-instead-of-simple-hash) – Mistalis Jan 25 '17 at 13:05

1 Answers1

3

Since AngularJS 1.6 there is a breaking change in routing:

The hash-prefix for $location hash-bang URLs has changed from the empty string "" to the bang "!".

(See https://github.com/angular/angular.js/blob/master/CHANGELOG.md)

Solution:

either start using #! Instead of # OR set up $locationProvider to accept just using #, like this:

appModule.config(['$locationProvider', function($locationProvider) {
    $locationProvider.hashPrefix('');
}]);
Arjan Einbu
  • 13,543
  • 2
  • 56
  • 59