Je développe actuellement une application angulaire utilisant sa fonctionnalité de routeur. Tous les itinéraires semblent avoir bien fonctionné jusqu'à ce que j'ai découvert qu'après une connexion réussie, le chemin de l'URL que j'ai défini sur, ce qui est «/ admin» ne sera pas suivi et le routeur par défaut à un «/». Ceci est le code: edit: (ajouté auth.guard.ts) strong> p> Bien qu'un identifiant réussi ait été effectué, le routeur redirigera un utilisateur à une URL vierge au lieu de l'URL définie que j'ai fourni spécifiquement dans le dossier car il se redirigera vers une URL vide, des éléments du En conclusion, comment puis-je avoir suivi les fonctions suivantes? Est-ce que je fais quelque chose de mal?
Merci pour l'aide! P> p>
login.ts code>. < / p>
li>
home.component.html code> s'afficheront également dans mon tableau de bord administratif que je ne veux pas arriver. P>
li>
ol>
4 Réponses :
Remplacer la fenêtre.Location.Assign ('/ admin')
avec p> routeur: routeur
Route: activatedRoute P> J'espère que c'est ce que vous voulez. p> p>
Pouvez-vous fournir comment vous avez ajouté le routeur au constructeur? Ne peut pas sembler reproduire votre solution.
Injecter le routeur juste comme u faire activéRoute
Vous pouvez utiliser routeur code> au lieu de
window.location.assign code> pour naviguer dans l'exemple de l'exemple de l'URL différent: P>
import { Router} from '@angular/router';
/* Login Component */
constructor(private router: Router, private authService: AuthService) { }
navigate() {
if (this.authService.getUserRole() == 'user' || 'agent') {
this.router.navigateByUrl('/')
} else if (this.authService.getUserRole() == 'admin') {
this.router.navigateByUrl('/admin')
}
}
J'ai déjà essayé cela avant, mais cela ne naviguait toujours pas à mon itinéraire souhaité, bien que la connexion ait réussi. La raison pour laquelle j'ai utilisé window.Location.Assign consiste à tromper le navigateur et à charger les nouveaux composants que j'ai navigue.
Ceci est le code que vous devriez pouvoir utiliser. Je suis beaucoup sous l'impression que l'URL que vous souhaitez naviguer pour n'existe pas. Normalement, vous recevrez une erreur dans la console de navigateur avec plus d'informations.
Êtes-vous sûr de naviguer sur la page d'administration?
Votre code semble mal que je pense. Il devrait être comme ci-dessous, sinon le premier est toujours vrai à cause de aussi je préfère || 'Agent' code> p>
=== code> pour la vérification de la valeur et de type. p> p>
Merci d'avoir souligné une de mes erreurs. || Rôle === 'Agent' Code> aurait dû être le bon code. Néanmoins, j'ai trouvé la réponse à mon problème. Je posterai bientôt une réponse!
dans mon Je l'ai modifié à la place de: p>
Remarque: j'ai aussi supprimé app.trouting.ts code> fichier, j'ai observé que, à partir du code ci-dessous, supprimer
{utilité: true} code> entraînerait une vérification correcte de l'URL. Ceci est dû au fait que l'ajout
{utilhash: true} code> ajoute un
/ # supplémentaire code> à mon URL entraînant la défaillance d'une URL vierge car elle ne correspond à aucun itinéraire. p>
Exporter Constt routage: modulewithProviders = routeursmodule.forroot (Apprétimes, {UTILOPTHASH: True, EnableRaCing: True}); Code> P>
Export Constt routage: modulewithProviders = roupmodule.forroot (Appréties); code> p>
EnabletraCing: true code> juste pour nettoyer mes résultats de la console. P>
Que voyez-vous dans votre console de navigateur ( F12 KBD>)
@Pieterjan C'est ce qui montre immédiatement dans mon événement de routeur: Navigation Start:
NavigationStart (ID: 1, URL: '/') code>
Quel est votre
auth -guard code>? De plus, votre routage me semble un peu étrange, vous n'utilisez pas la construction angulaire dans la fonctionnalité de routage ( angular.io/ guide / routeur ) au lieu de
window.location.assign ('/ admin') code> Vous devez utiliser
this.router.navigate (["admin '], {Relativeto: this .Route}); code>
Je vais éditer mon message pour ajouter l'AuthGuard! En outre, la raison pour laquelle j'ai utilisé
window.location.Assign code> est de tromper le navigateur en pensant que j'ai déjà redirigé vers la route. Cela est dû à certaines de mes fonctionnalités uniquement en cours de chargement si je rafraîchis la demande.
@Pieterjan aucune idée?
Pouvez-vous partager votre code sur github.com? Créez simplement un repo,
git clone [url] code>, collez vos fichiers à l'intérieur du dossier,
git Ajouter. Code>,
GIT COMMIT code>,
Git Appuyez sur code> et partagez l'URL à votre repo.