javascriptangularjsaddress-barlocation-providerroute-provider

Turn off URL manipulation in AngularJS


I'm trying to write my first web-app with Angular.

In the normal mode (html5Mode off), Angular forces the address's hash part to look like a "path" (adding a leading "/"), and encodes special characters - for example, it allows a single "?" and "#" in the hash and replaces the others with %3F and %23.

Is there a way to turn this feature off? I don't want to use the $locationProvider / $routeProvider features - I want to parse the hash myself (In my case, the user's will enter some "free text" in the hash to search inside my website).

I read that the routeProvider cannot be configured to use regular expressions...

If htmlMode is turned on, then the address's hash part is not forced to look like a path (no leading "/"), but it still encodes special characters.

I'm aware that some browsers might encode/escape the special characters anyway, but if the user managed to enter some special characters in its address bar then I don't want to change it.

Thanks


Solution

  • Not sure of the side effects of this, but it gets the job done. Note that it will disable all location manipulation from the angular app, even if intended.

    angular.module('sample', [])
        .config( ['$provide', function ($provide){
            $provide.decorator('$browser', ['$delegate', function ($delegate) {
                $delegate.onUrlChange = function () {};
                $delegate.url = function () { return ""};
                return $delegate;
            }]);
        }]);
    

    ES6 variant:

    angular.module('sample', [])
        .config(["$provide", $provide => {
            $provide.decorator("$browser", ["$delegate", $delegate => {
                $delegate.onUrlChange = () => { };
                $delegate.url = () => "";
    
                return $delegate;
            }]);
        }]);
    

    Tested in Chrome 30, IE9, IE10.
    Inspired by https://stackoverflow.com/a/16678065/369724