Angular Hash versus Hashbang

Question

Why does Angular sometimes use a hash in the URL and other times use a hashbang? I've started writing two Angular apps from scratch. Neither are using HTML5 mode. Both have the same default route. However, the default URLs display differently.

I've been seeing this random behaviour for at least a year... long before angular-route v1.6. Also, I've always used angular-ui-router.

The default route:

configRoutes.$inject = ['$urlRouterProvider'];
function configRoutes ($urlRouterProvider) {
    $urlRouterProvider.otherwise('/');
}

App #1 resolves this... http://localhost:3000 ... to this ... http://localhost:3000/#/

App #2 resolves this... http://localhost:3001 ... to this ... http://localhost:3001/#!/

Note the last two characters in the default URL.

I know how to activate HTML5 mode and pretty URLs. That is not what I'm asking. I would really like to understand the significance of both URLs above and why Angular is writing them differently.

Current versions:
angular-ui-router v0.3.2
angular v1.6.0

This most likely has to do with the hash prefix setup - which default may vary depending on the angular version I think. Not sure if angular ui router may mix things up. Are you using the same angular version for both applications? Try setting this up manually in the config block of your application with $locationProvider.hashPrefix() and see how it affects the url — IAmDranged, Dec 22 '16 at 16:51
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 12:48

score 4 · Answer 1 · answered Jan 12 '17 at 11:15

When we upgraded from angular 1.5 to angular 1.6, the URL of our app changed from /#/ to /#!/. We fixed the problem by configuring the hashPrefix in the application config:

angular.module("myApp").config(function($locationProvider) {
   $locationProvider.hashPrefix("");  
});

Angular Hash versus Hashbang

1 Answers1

Linked