javascript - Disable UI-Router Interaction with window.location -


this long shot, ui-router popular, thought maybe here have insight on issue.

i'm migrating project angular js. project consists of page several different panels - each of downloaded server html ajax, injected page javascript, , associated own href, managed jquery history.

jquery history tracked browser states , updated window.href accordingly after each panel injected javascript. instance:

panel 1:   window.location.href // http://myapp.com/panel1   history.getlocationhref() // http://myapp.com/panel1   history.getpageurl() // http://myapp.com/panel1 panel 2:   window.location.href // http://myapp.com/panel2   history.getlocationhref() // http://myapp.com/panel2   history.getpageurl() // http://myapp.com/panel2 panel 3:   window.location.href // http://myapp.com/panel3   history.getlocationhref() // http://myapp.com/panel3   history.getpageurl() // http://myapp.com/panel3 

etc, etc.

because each of these panels injected, rather compiling them angular after injection dom, i'm bootstrapping separate angularjs apps each of them. has worked fine until now.

now i'm using angularjs ui-router in panel 2 - can render data in alternative templates. problem is, ui-router must somehow mess browser history and/or window href. because once app instantiated, let's start @ panel 1, click panel 2, click panel 3, have problem:

panel 1:   window.location.href // http://myapp.com/panel1   history.getlocationhref() // http://myapp.com/panel1   history.getpageurl() // http://myapp.com/panel1 panel 2:   window.location.href // http://myapp.com/panel2   history.getlocationhref() // http://myapp.com/panel2   history.getpageurl() // http://myapp.com/panel2 panel 3:   window.location.href // http://myapp.com/panel2   history.getlocationhref() // http://myapp.com/panel2   history.getpageurl() // http://myapp.com/panel3 

basically, once ui-router instantiated app, jquery history no longer works, , location href persists @ url of ui-router app.

is there can disable ui-router's interaction window's location href? or integral how module works?

here's panel2.states.js file if helps:

angular.module("panel2") .config(["$stateprovider", function($stateprovider) {   $stateprovider     .state('table', {       views: {         index: {  //             controller: "tablecontroller at",             templateurl: "table.html"         }       }     })     .state('tiles', {       views: {         index: { //              controller: "tilescontroller tc",             templateurl: "tiles.html"         }       }     }); }]); 

update (4/27/2015)

i solved particular issue getting rid of jquery history , features adds beyond need. instead interact directly window.history:

 window.history.pushstate({panel: "panel3"},      document.title + " | " + 'panel3',      window.location.href + "/panel3"); 

i'm still curious causing interaction , if angular or angular ui-router directly interacts window.location?

angular exposes $location service interact window.location object , i'm pretty sure ui-router uses , not window.location object directly. can decorate $location service config function intercept calls $location service , provide own implementation not use window.location.

e.g. (highly simplified):

$provide.decorate('$location', function($delegate) {     var currenturl = '';     //we base proxy on original     var locationproxy = object.create($delegate);     //and overwrite need     locationproxy.url = function(newurl) {         if (newurl) {             $rootscope.$broadcast('$locationchangestart' /* other event args here*/);             currenturl = newurl;             $rootscope.$broadcast('$locationchangesuccess' /* other args here */);         } else {             return currenturl;         }     };  }); 

it require implement functions in compatible way original $location service, quite bit of work.


Comments

Popular posts from this blog

shopping cart - Page redirect not working PHP -

php - How to modify a menu to show sub-menus -

python - Installing PyDev in eclipse is failed -