How to reload or re-render the entire page using AngularJS

Question

After rendering the entire page based on several user contexts and having made several  http requests  I want the user to be able to switch contexts and re-render everything again  resending all  http requests  etc   If I just redirect the user somewhere else  things work properly    scope on impersonate success   function response         window location reload       This cancels any current request    location path          This works as expected  if path    current path      scope impersonate   function username      return auth impersonate username       then  scope on impersonate success   scope on auth failed        If I use  window location reload    then some of the  http requests on auth impersonate username  that are waiting for a response get cancelled  so I can t use that  Also  the hack  location path  location path    doesn t work either  nothing happens    Is there another way to re-render the page without manually issuing all requests again

User · Accepted Answer

For the record  to force angular to re-render the current page  you can use    route reload      According to AngularJS documentation      Causes  route service to reload the current route even if  location hasn t changed       As a result of that  ngView creates new scope  reinstantiates the controller

User · Answer

Before Angular 2   AngularJs   Through route  route reload     If you want reload whole Application  window location reload     Angular 2  import   Location   from   angular common    constructor private location  Location      ngOnInit         load         this location reload      Or constructor private location  Location      ngOnInit         Methods         this ngOnInit

User · Answer

Well maybe you forgot to add   route  when declaring the dependencies of your Controller   app controller  NameCtrl      scope    route   function  scope  route              route reload    Then this should work fine

User · Answer

I got this working code for removing cache and reloading the page    View           lt a class  btn  ng-click  reload    gt               lt i class  icon-reload  gt  lt  i gt            lt  a gt    Controller  Injectors   scope  state  stateParams  templateCache          scope reload   function        To Reload anypage              templateCache removeAll                      state transitionTo  state current   stateParams    reload  true  inherit  true  notify  true

User · Answer

If you want to refresh the controller while refreshing any services you are using  you can use this solution    Inject  state   i e   app controller  myCtrl     scope   MyService    state   function  scope MyService  state           At the point where you want to refresh the controller including MyServices       state reload           OR        state go  state current       reload  true        This will refresh the controller and the HTML as well you can call it Refresh or Re-Render

User · Answer

For reloading the page for a given route path  -   location path   path1 path2     route reload

User · Answer

Use the following code without intimate reload notification to the user  It will render the page    var currentPageTemplate    route current templateUrl   templateCache remove currentPageTemplate    window location reload

User · Answer

route reload   will reinitialise the controllers but not the services  If you want to reset the whole state of your application you can use    window location reload      This is a standard DOM method which you can access injecting the  window service   If you want to be sure to reload the page from the server  for example when you are using Django or another web framework and you want a fresh server side render  pass true as a parameter to reload  as explained in the docs  Since that requires interaction with the server  it will be slower so do it only if necessary  Angular 2  The above applies to Angular 1  I am not using Angular 2  looks like the services are different there  there is Router  Location  and the DOCUMENT  I did not test different behaviors there

User · Answer

Just to reload everything   use window location reload    with angularjs  Check out working example  HTML   lt div ng-controller  MyCtrl  gt     lt button  ng-click  reloadPage     gt Reset lt  button gt   lt  div gt    angularJS  var myApp   angular module  myApp        function MyCtrl  scope         scope reloadPage   function   window location reload         http   jsfiddle net HB7LU 22324

User · Answer

If you are using angular ui-router this will be the best solution    scope myLoadingFunction   function          state reload

User · Answer

I ve had a hard fight with this problem for months  and the only solution that worked for me is this   var landingUrl    http   www ytopic es     URL complete  window location href   landingUrl

User · Answer

Easiest solution I figured was   add     to the route that want to be reloaded every time when coming back   eg   instead of the following   routeProvider    when   About         templateUrl   about html       controller   AboutCtrl         use    routeProvider    when   About        notice the     at the end      templateUrl   about html       controller   AboutCtrl

User · Answer

Try one of the following    route reload       don t forget to inject  route in your controller  window location reload    location reload

[javascript] How to reload or re-render the entire page using AngularJS

Examples related to javascript

Examples related to angularjs

Examples related to node.js

Examples related to reload

Examples related to rerender