Comment récupérer l'URL route en cours dans Angular ?
Avec le framework Angular, on peut concevoir un site dont la navigation se fait de manière classique avec une URL qui évolue en fonction des actions de l'utilisateur. Grâce à un composant du framework, il est possible de connaître l'URL en cours dans son code.
Depuis la version 2 d'Angular, le composant "Router" existe en version 3. Cette version apporte la possibilité de connaître l'URL en cours sur son site internet. Il faut en premier importer le composant "Router" dans votre propre composant. On utilise pour cela la directive "import".
import { Router } from '@angular/router';
Ensuite, le composant Router doit être ajouté en tant qu'attribut de votre composant. Pour cela, il suffit de déclarer le composant "Router" en paramètre du constructeur.
constructor(private router: Router) {}
Pour accéder à l'URL, il suffit alors d'indiquer la propriété "this.route.url".
ngOnInit() {
if (this.router.url.startsWith("/user")) {
console.log("Nous sommes dans l'écran de gestion des utilisateurs.");
}
}
Si le système de navigation de votre site internet est conçu pour utiliser les tags, cette propriété ne vous sera pas utile. En effet, les tags doivent être précédés du caractère "#". Si vous utilisez les tags pour gérer la navigation de votre site, la propriété "this.router.url" contiendra systématiquement la valeur "/". Vous ne pourrez pas accéder au tag en utilisant ce procédé.