web-dev-qa-db-fra.com

AngularJS - Comment puis-je faire une redirection avec un chargement complet de la page?

Je souhaite effectuer une redirection qui effectue un rechargement complet de la page afin que les cookies de mon serveur Web soient actualisés lors du chargement de la page. window.location = "/#/Next" et window.location.href = "/#/Next" ne fonctionnent pas, ils font un itinéraire angulaire qui ne frappe pas le serveur.

Quelle est la bonne façon de faire une demande de serveur complet dans un contrôleur angulaire?

92
Mike Pateras

Pour les tags <a>:

Vous devez coller target="_self" sur votre tag <a>

AngularJS effectuera un rechargement de page complète dans trois cas:

  • Liens contenant l'élément cible
    Exemple: <a href="/ext/link?a=b" target="_self">link</a>
  • Liens absolus qui vont vers un domaine différent
    Exemple: <a href="http://angularjs.org/">link</a>
  • Liens commençant par '/' qui mènent à un chemin de base différent lorsque la base est définie
    Exemple: <a href="/not-my-base/link">link</a>

Utilisation de javascript:

Le service $location vous permet de modifier uniquement l'URL; cela ne vous permet pas de recharger la page. Lorsque vous devez modifier l'URL et recharger la page ou naviguer vers une autre page, veuillez utiliser une API de niveau inférieur: $window.location.href.

Voir:

180
jszobody

Nous avons eu le même problème, en travaillant à partir de code JS (c’est-à-dire pas à partir de l’ancre HTML). Voici comment nous avons résolu cela:

  1. Si nécessaire, pratiquement modifie l'URL actuelle via le service $location. Cela peut être utile si votre destination est simplement une variante de l'URL actuelle afin de pouvoir tirer parti des méthodes d'assistance $location. Par exemple. nous avons exécuté $location.search(..., ...) pour modifier simplement la valeur d'un paramètre de chaîne de requête.

  2. Construisez la nouvelle URL de destination, en utilisant le _$location.url() actuel, si nécessaire. Pour fonctionner, ce nouveau système devait tout inclure après le schéma, le domaine et le port. Donc, par exemple si vous voulez passer à: 

    http://yourdomain.com/YourAppFolder/YourAngularApp/#/YourArea/YourAction?culture=fr

    alors vous devriez définir l'URL comme dans:

    var destinationUrl = '/YourAppFolder/YourAngularApp/#/YourArea/YourAction?culture=en';

    (avec le '/' en tête également).

  3. Attribuer une nouvelle URL de destination à bas niveau: $window.location.href = destinationUrl;

  4. Forcer le rechargement, toujours au plus bas niveau: $window.location.reload();

32
superjos

Après avoir recherché et donné un hit et une session d’essai, je peux le résoudre en spécifiant d’abord l’URL comme

$window.location.href = '/#/home/stats';

puis recharger

$window.location.reload();
11
Daniyal

J'ai eu le même problème. Lorsque j’utilise window.location, $window.location ou même <a href="..." target="_self">, la route n’actualise pas la page. Donc, les services en cache sont utilisés, ce qui n'est pas ce que je veux dans mon application. Je l'ai résolu en ajoutant window.location.reload() après window.location pour forcer le rechargement de la page après le routage. Cette méthode semble toutefois charger la page deux fois. Peut-être un sale tour, mais ça fait le travail. Voici comment je l'ai maintenant:

  $scope.openPage = function (pageName) {
      window.location = '#/html/pages/' + pageName;
      window.location.reload();
  };
9
Neel

Essaye ça

$window.location.href="#page-name";
$window.location.reload();
0
Suresh Maurya