web-dev-qa-db-fra.com

Comment angular application gère-t-il la page d'actualisation et pourrions-nous utiliser $ history sur les directives de chargement

Donc deux questions.

  1. Comment les applications angular gèrent la page d'actualisation, b/c d'après ce que j'ai entendu, $ rootScope destroy () lors de l'actualisation et l'application est réexécutée et reconfigurée, et je me demandais si il existe un moyen élégant de conserver $ rootScope sans avoir à stocker les variables $ rootScope sous forme de chaîne dans un stockage.

  2. Si je charge un modèle sur une directive qui charge un modal sur la page, est-il possible de configurer l'historique pour ne pas naviguer mais pour inverser le modal ouvert. et en raison de validations et autres, je ne pense pas qu'il soit possible d'implémenter la même fonction en utilisant href.

19
user2167582

Si vos URL sont mappées avec le $routeProvider, Vous pouvez recharger un contrôleur en appelant $route.reload(). Cela actualise la page sans détruire le $ rootScope.
J'ai créé n plongeur pour le montrer . Le contrôleur compte combien de fois la page a été rechargée.

21
pasine

Il n'y a probablement aucun moyen de conserver une variable javascript via un rechargement de page et $ rootScope est juste une variable javascript.

Il semble cependant que ce que vous recherchez soit un moyen de faire en sorte que votre application "démarre à partir du même point" qu'elle a été laissée lors du rechargement d'une page. Je vous recommande de vous familiariser avec la notion d'état . Chaque application peut être considérée comme un ensemble d'états et de transitions entre eux. Chaque interaction utilisateur ou toute autre action qui se produit dans les applications modifie l'état de l'application ou la maintient dans le même état. Par exemple: en cliquant sur un lien utilisateur dans une liste d'utilisateurs, l'état passe de "voir la liste des utilisateurs" à "voir les détails de l'utilisateur pour l'utilisateur avec id = 213", en cliquant sur un bouton "Modifier" sur "voir les détails de l'utilisateur pour l'utilisateur avec id = 213 "change d'état pour" modifier l'utilisateur avec id = 213 ". Et au fur et à mesure de ces transitions, des valeurs sont affectées aux variables, les vues changent, les demandes sont envoyées, etc.

Les deux choses qui sont nécessaires pour le problème "commencer à partir du même point" sont le gestionnaire d'état et un moyen de sérialiser et de stocker les états.

En tant que gestionnaire d'état en plus de la directive core $ router, vous pouvez utiliser i-router . Quant à un moyen de sérialiser et de stocker un état avec i-router le fait via URL. L'avantage de ui-router sur core $ router est qu'il permet des états imbriqués et est généralement plus flexible.

i-router a également une solution pour votre deuxième question dans son wiki github https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions# comment-ouvrir-un-dialogue-modal-à-un-certain-état

11
ihor marusyk

Ne pourriez-vous pas utiliser window.localstorage pour conserver vos variables js? De cette façon, si l'utilisateur actualise la page en dehors de l'application, vous pouvez recharger vos valeurs

2
hamncheez