Comment recharger ou re-rendre la page entière en utilisant AngularJS

Après avoir rendu la page entière en fonction de plusieurs contextes utilisateur et avoir fait plusieurs $httpdemandes, je veux que l'utilisateur puisse changer de contexte et tout restituer à nouveau (renvoyer toutes les $httpdemandes, etc.). Si je redirige simplement l'utilisateur ailleurs, les choses fonctionnent correctement:

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

Si j'utilise $window.location.reload(), alors certaines des $httpdemandes auth.impersonate(username)qui attendent une réponse sont annulées, donc je ne peux pas l'utiliser. De plus, le hack $location.path($location.path())ne fonctionne pas non plus (rien ne se passe).

Existe-t-il un autre moyen de restituer la page sans émettre à nouveau toutes les demandes manuellement?

Pour mémoire, pour forcer angulaire à restituer la page courante, vous pouvez utiliser:

$route.reload();

Selon la documentation AngularJS :

Force $ route service à recharger la route actuelle même si $ location n'a pas changé.

À la suite de cela, ngView crée une nouvelle portée, rétablit le contrôleur.

$route.reload()va réinitialiser les contrôleurs mais pas les services. Si vous souhaitez réinitialiser l'ensemble de l'état de votre application, vous pouvez utiliser:

$window.location.reload();

Il s'agit d'une méthode DOM standard à laquelle vous pouvez accéder en injectant le service $ window .

Si vous voulez être sûr de recharger la page à partir du serveur, par exemple lorsque vous utilisez Django ou un autre framework web et que vous voulez un nouveau rendu côté serveur, passez trueen paramètre à reload, comme expliqué dans la documentation . Comme cela nécessite une interaction avec le serveur, il sera plus lent, alors ne le faites que si nécessaire

Angulaire 2

Ce qui précède s'applique à Angular 1. Je n'utilise pas Angular 2, il semble que les services soient différents là-bas, il y Routeren a Location, et le DOCUMENT. Je n'y ai pas testé différents comportements

Pour recharger la page d'un chemin d'itinéraire donné: -

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

Si vous utilisez un routeur ui angulaire, ce sera la meilleure solution.

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

Eh bien peut-être avez-vous oublié d'ajouter "$ route" lors de la déclaration des dépendances de votre Controller:

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

Juste pour tout recharger, utilisez window.location.reload (); avec angularjs

Consultez l'exemple de travail

HTML

<div ng-controller="MyCtrl">  
<button  ng-click="reloadPage();">Reset</button>
</div>

angularJS

var myApp = angular.module('myApp',[]);

function MyCtrl($scope) {
    $scope.reloadPage = function(){window.location.reload();}
}

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

Si vous souhaitez actualiser le contrôleur tout en actualisant les services que vous utilisez, vous pouvez utiliser cette solution:

• Injecter $ state

c'est à dire

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

Cela actualisera le contrôleur et le HTML, vous pouvez aussi l'appeler Actualiser ou Rendre à nouveau .

Avant Angular 2 (AngularJs)

Par route

$route.reload();

Si vous voulez recharger toute l'application

$window.location.reload();

Angulaire 2+

import { Location } from '@angular/common';

constructor(private location: Location) {}

ngOnInit() {  }

load() {
    this.location.reload()
}

Ou

constructor(private location: Location) {}

ngOnInit() {  }

Methods (){
    this.ngOnInit();
}

La solution la plus simple que je pensais était,

ajoutez '/' à la route qui veut être rechargée à chaque fois en revenant.

par exemple:

au lieu des suivants

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

utilisation,

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

Essayez l'une des solutions suivantes:

$route.reload(); // don't forget to inject $route in your controller
$window.location.reload();
location.reload();

J'ai obtenu ce code de travail pour supprimer le cache et recharger la page

Vue

        <a class="btn" ng-click="reload()">
            <i class="icon-reload"></i> 
        </a>

Manette

Injecteurs: $ scope, $ state, $ stateParams, $ templateCache

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

Utilisez le code suivant sans notification de rechargement intime à l'utilisateur. Il rendra la page

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

J'ai eu un combat acharné avec ce problème pendant des mois, et la seule solution qui a fonctionné pour moi est la suivante:

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