Quel est l'utilisation de la propriété onSameUrlNavigation dans Angular (versions supérieures à 5)

Question

Récemment, j'ai entendu parler d'une propriété appelée onSameUrlNavigation où vous pouvez la définir sur "reload". J'ai cherché sur Google à ce sujet mais il n'y a pas beaucoup d'articles qui montrent l'utilisation de cette propriété. Est-ce que quelqu'un peut m'aider avec un exemple concret de l'endroit exact où nous devons utiliser cette propriété.

@ngModule({
 imports: [RouterModule.forRoot(routes, {onSameUrlNavigation: ‘reload’})],
 exports: [RouterModule],
 })

Answer 1

OnSameUrlNavigation configure comment le router gère la navigation vers l'URL actuelle. Par défaut, le router ignorera cette navigation. Cependant, cela empêche des fonctionnalités telles qu'un bouton "actualiser". Utilisez cette option pour configurer le comportement lors de la navigation vers l'URL actuelle. La valeur par défaut est 'ignore'. en le définissant sur ‘reload’, vous pouvez naviguer vers l'itinéraire actuel et déclencher à nouveau les événements du router en le définissant sur 'ignore' si vous naviguez vers la même page, cela ne changera pas l'itinéraire, voir cet exemple:

imports: [ BrowserModule, FormsModule, RouterModule.forRoot(routes, {
    // onSameUrlNavigation: 'ignore',
    onSameUrlNavigation: 'reload'
  }) ],

Answer 2

Pour moi, l'ajout de onSameUrlNavigation n'a absolument rien changé à mon routage Angular.

Lorsque j'essayais de naviguer, par exemple, de /users:123 à /users:234, cette option ne me permettait pas de rafraîchir la page. Mes pages Angular contiennent des grilles complexes, et j'avais spécifiquement besoin qu'elles soient supprimées et recréées lorsque je passais à un autre utilisateur.

Ce qui a fonctionné (tuez-moi maintenant...) a été d'ajouter ceci à mon code.

let newRouterLink = '/users:123';
this.router.navigate(['/']).then(() => { this.router.navigate([newRouterLink ]); })

C'est moche, mais ça fait le travail....