Como recarregar ou renderizar novamente a página inteira usando o AngularJS

Depois de renderizar a página inteira com base em vários contextos do usuário e ter feito várias solicitações $http , quero que o usuário possa alternar contextos e renderizar novamente tudo novamente (reenviando todas as solicitações $http , etc). Se eu apenas redirect o usuário para outro lugar, as coisas funcionam corretamente:

 $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); }; 

Se eu usar $window.location.reload() , algumas das solicitações $http em auth.impersonate(username) que estão aguardando uma resposta serão canceladas, então não posso usá-la. Além disso, o hack $location.path($location.path()) também não funciona (nada acontece).

Existe outra maneira de renderizar novamente a página sem emitir manualmente todas as solicitações novamente?

Para o registro, para forçar o ângulo a renderizar novamente a página atual, você pode usar:

 $route.reload(); 

De acordo com a documentação do AngularJS:

Faz com que o serviço $ route recarregue a rota atual, mesmo que a localização $ não tenha sido alterada.

Como resultado disso, o ngView cria novo escopo, reinstitui o controlador.

$route.reload() irá reinicializar os controladores, mas não os serviços. Se você quiser redefinir todo o estado do seu aplicativo, você pode usar:

 $window.location.reload(); 

Este é um método DOM padrão que você pode acessar injetando o serviço $ window .

Se você quiser ter certeza de recarregar a página do servidor, por exemplo, quando estiver usando o Django ou outra estrutura da web e desejar uma nova renderização do lado do servidor, passe true como um parâmetro para reload , conforme explicado nos documentos . Como isso requer interação com o servidor, será mais lento, portanto, somente se necessário

Angular 2

O acima aplica-se a Angular 1. Eu não estou usando Angular 2, parece que os serviços são diferentes lá, há Router , Location e o DOCUMENT . Eu não testei comportamentos diferentes lá

Para recarregar a página para um determinado caminho de rota:

 $location.path('/path1/path2'); $route.reload(); 

Se você estiver usando o roteador ui angular, esta será a melhor solução.

 $scope.myLoadingFunction = function() { $state.reload(); }; 

Bem, talvez você tenha esquecido de adicionar “$ route” ao declarar as dependencies do seu Controlador:

 app.controller('NameCtrl', ['$scope','$route', function($scope,$route) { // $route.reload(); Then this should work fine. }]); 

Apenas para recarregar tudo, use window.location.reload (); com angularjs

Confira o exemplo de trabalho

HTML

 

angularJS

 var myApp = angular.module('myApp',[]); function MyCtrl($scope) { $scope.reloadPage = function(){window.location.reload();} } 

http://jsfiddle.net/HB7LU/22324/

A solução mais fácil que imaginei foi

adicione ‘/’ à rota que deseja ser recarregada toda vez que voltar.

por exemplo:

em vez do seguinte

 $routeProvider .when('/About', { templateUrl: 'about.html', controller: 'AboutCtrl' }) 

usar,

 $routeProvider .when('/About/', { //notice the '/' at the end templateUrl: 'about.html', controller: 'AboutCtrl' }) 

Se você deseja atualizar o controlador ao atualizar os serviços que está usando, use esta solução:

  • Injetar $ state

ou seja

 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}); } 

Isso irá atualizar o controlador e o HTML, assim você pode chamar Refresh ou Re-Render .

Eu tenho este código de trabalho para remover o cache e recarregar a página

Visão

     

Controlador

Injetores: $ scope, $ state, $ stateParams, $ templateCache

  $scope.reload = function() { // To Reload anypage $templateCache.removeAll(); $state.transitionTo($state.current, $stateParams, { reload: true, inherit: true, notify: true }); }; 

Antes Angular 2 (AngularJs)

Através de rota

 $route.reload(); 

Se você quiser recarregar todo o aplicativo

 $window.location.reload(); 

Angular 2+

 import { Location } from '@angular/common'; constructor(private location: Location) {} ngOnInit() { } load() { this.location.reload() } 

Ou

 constructor(private location: Location) {} ngOnInit() { } Methods (){ this.ngOnInit(); } 

Use o seguinte código sem notificação de recarregamento íntimo para o usuário. Irá renderizar a página

 var currentPageTemplate = $route.current.templateUrl; $templateCache.remove(currentPageTemplate); $window.location.reload(); 

Eu tive uma briga dura com esse problema por meses, e a única solução que funcionou para mim é esta:

 var landingUrl = "http://www.ytopic.es"; //URL complete $window.location.href = landingUrl;