Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

like image 909
Oren Avatar asked Sep 04 '13 10:09

Oren


2 Answers

I use a local copy of angular.js. Search for

$browser.onUrlChange(function(newUrl, newState) { 

and

$rootScope.$watch(function $locationWatch() { 

comment out the corresponding lines and angularjs will stop watch for location url changes.

like image 37
Yang Zhang Avatar answered Oct 02 '22 22:10

Yang Zhang


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

like image 128
grae.kindel Avatar answered Oct 02 '22 22:10

grae.kindel