web-dev-qa-db-fra.com

Comprendre l'objectif du projet de magasin de routeurs ngrx par rapport à l'utilisation uniquement du routeur angular 2

Je fais référence au projet ngrx de routeur-magasin ( https://github.com/ngrx/router-store ).

Je ne sais pas comment utiliser ce projet ...

Prenons par exemple l'exemple suivant de la documentation du projet:

store.dispatch(go(['/path', { routeParam: 1 }], { query: 'string' }));

Est-ce destiné à être utilisé en remplacement du routeur angular 2: router.navigate(['/path...?

... ou dois-je utiliser le routeur-magasin ngrx uniquement dans certaines circonstances? (si oui, lesquels?)

Aussi ce qui arrive au routeur-magasin ngrx quand un lien angular 2 routeur html par exemple <a routerLink="/heroes" est cliqué?

Plus généralement, quelqu'un peut-il expliquer ce qui est réalisé par le projet ngrx router-store par rapport à l'utilisation du routeur ordinaire angular 2?

Ou pour reformuler, qu'apporte ngrx router-store en plus du angular 2 routeur?

Edit : Une source intéressante d'informations et d'échantillons sur ngrx est bien sûr l'exemple d'application ngrx ( https://github.com/ ngrx/example-app ).

J'ai trouvé une dépendance au routeur-magasin là-bas mais je n'ai pas pu trouver où le routeur-magasin est utilisé dans l'application ...

Pour info, voici le commentaire à trouver dans l'exemple d'application sur le magasin de routeurs:

@ ngrx/router-store maintient l'état du routeur à jour dans le magasin et utilise le magasin comme source unique de vérité pour l'état du routeur.

45
balteo

Le @ngrx/router-store existe de sorte qu'il est possible que le magasin soit source unique de vérité pour l'état de routage d'une application.

Sans cela, il y aurait un état d'application - l'itinéraire actuel - non représenté dans le magasin. Cela signifie que le débogage de voyage dans le temps en utilisant DevTools ne serait pas possible, car il n'y aurait aucun état dans le magasin représentant l'itinéraire et il n'y aurait aucune action représentant les changements d'itinéraire.

Le router-store ne remplace pas le Angular; il ne fait que câbler les écouteurs pour les actions de routage et pour le routeur lui-même.

Lorsque vous émettez une action de routage à l'aide du go créateur d'actions , un "[Router] Go" l'action contenant le chemin spécifié est entendue par le router-store qui appelle ensuite la méthode de routeur correspondante. Quand le router-store entend - du routeur - que l'itinéraire a changé, il émet un "[Router] Update Location" action représentant le changement de route et cette action voit l'état du routeur dans le magasin mis à jour.

Si, au lieu d'utiliser le créateur d'action go, un routerLink est utilisé pour effectuer un changement de route, router-store entendra le changement et émettra un "[Router] Update Location" action qui verra l'état du routeur du magasin mis à jour.

Ainsi, que l'itinéraire soit modifié via des actions ou des liens plus traditionnels, le magasin contient toujours l'état du routeur.

Avec le "[Router] Update Location" actions représentant des changements de route, vous pouvez annuler ces changements de route via les DevTools - quelque chose qui ne serait pas possible si l'état du routeur n'était pas représenté dans le magasin.

Si vous n'avez pas utilisé les Redux DevTools, je vous recommande de les vérifier:

68
cartant