AngularJs UI-Router - Page Refresh $state.current is now empty -
i have angular
application using ui-router
, having issues whenever refresh page. using nested views, named views build application. whenever refresh page, ui-router
doesn't reload current state , leaves page blank.
on page load $state.current
equal to
object {name: "", url: "^", views: null, abstract: true}
i reading navigation .json
file via $http
, looping through states. can show:
stateprovider.state(navelement.statename, { url: navelement.regexurl ? navelement.regexurl : url, searchpage: navelement.searchpage, //something custom added parent: navelement.parent ? navelement.parent : "", redirectto: navelement.redirectto, views: { 'subnav@index': { templateurl: defaults.secondarynavigation, controller: 'secondarynavigationcontroller ctrl' //static }, 'pagecontent@index': { template: navelement.templateurl == null ? '<div class="emptycontent"></div>' : undefined, templateurl: navelement.templateurl == null ? undefined : navelement.templateurl, controller: navelement.controller == null ? undefined : navelement.controller + ' ctrl' } } });
this code gets executed each item in nested json object. if there else helpful, let me know.
there question: angularjs - ui-router - how configure dynamic views 1 answer, shows how that.
what happening? on refresh,
url
evaluated sooner, states registered. have postpone that. , solution drivenui-router
native featuredeferintercept(defer)
$urlrouterprovider.deferintercept(defer)
as stated in doc:
disables (or enables) deferring location change interception.
if wish customize behavior of syncing url (for example, if wish defer transition maintain current url), call method @ configuration time. then, @ run time, call
$urlrouter.listen()
after have configured own$locationchangesuccess
event handler.
in nutshell, stop url handling in config phase:
app.config(function ($urlrouterprovider) { // prevent $urlrouter automatically intercepting url changes; // allows configure custom behavior in between // location changes , route synchronization: $urlrouterprovider.deferintercept(); })
and re-enable in .run() phase, once configured dynamic states json:
.run(function ($rootscope, $urlrouter, userservice) { ... // once user has logged in, sync current url // router: $urlrouter.sync(); // configures $urlrouter's listener *after* custom listener $urlrouter.listen(); });
Comments
Post a Comment