angular2: CanDeactivate garde
J'ai créé un CanDeactivate garde qui retourne un observables et elle est appliquée à un composant qui est chargé dans un intérieur imbriquée routeur de sortie. Si ce dispositif doit être appelé à chaque fois qu'on essaie de naviguer vers une autre url? Je vous pose cette question parce que ce n'est pas le cas dans mon cas.
Dans mon cas, la garde seule appelée pour la première de "différent" de l'URL. Permettez-moi d'essayer de l'expliquer avec un exemple. Supposons que je suis toujours en renvoyant false et je suis en train de parcourir les différents urls de la même composant:
/A --> guard called
/B --> guard called
/B --> no navigation and no guard called
/A --> guard called
/A -->guard not called and no navigation
Est-ce le comportement attendu?
modifier Bien, il semble que comme il est. Vient de construire un petit échantillon avec 3 composants et de la garde d'être appelé pour la 1ère fois que l'utilisateur tente d'accéder à une url spécifique...c'est vraiment bizarre...
De toute façon, voici le code que j'utilise:
//app.routing
import {NgModule} from "@angular/core";
import {Routes, RouterModule, Route, CanDeactivate, ActivatedRouteSnapshot,
RouterStateSnapshot} from "@angular/router";
import { MainComponent } from "./main/main.component";
import { OtherComponent } from "./other/other.component";
import { Other3Component } from "./other3/other3.component";
import {Observable} from "rxjs/observable";
const fallback: Route = {
path: "**",
redirectTo: "/main",
pathMatch: "full"
};
export class Test implements CanDeactivate<MainComponent>{
canDeactivate(component: MainComponent, route: ActivatedRouteSnapshot,
state: RouterStateSnapshot): Observable<boolean> | boolean{
console.log("in");
return false;
}
}
export const rotas: Routes = [
{
path: "main",
component: MainComponent,
canDeactivate: [Test]
},
{
path: "other",
component: OtherComponent
},
{
path: "other3",
component: Other3Component
},
fallback
];
@NgModule({
imports: [RouterModule.forRoot(rotas)],
exports: [RouterModule]
})
export class AppRoutingModule{}
//app.component.html
<h1>
<a routerLink="/main">Main</a>
<a routerLink="/other">Other</a>
<a routerLink="/other3">Other3</a>
</h1>
Tout a été généré par angulaires-cli (ex.: n g composant XXX). Oui, le CanDeactivate garde renverra toujours false donc vous ne serez pas en mesure de décharger le composant principal. Donc, la première fois que je clique sur les autres, la garde est appelé. Si vous cliquez à nouveau sur d'autres, pas de garde est appelé. Cependant, si je clique sur autre3, la garde est appelé. En cliquant sur le autre3 ne sera pas vraiment faire quelque chose jusqu'à ce que j'ai cliqué sur le lien (ex.: d'autres)...
Est-ce le comportement attendu? Je dois dire que je l'ai attendu ma garde pour se faire frapper à chaque fois que j'ai frappé un autre lien...
Grâce.
Luis
Vous devez vous connecter pour publier un commentaire.
j'ai trouvé cette solution, au lieu de créer un candeactivate de la garde pour chaque composant, vous permettra de créer un service de garde et d'ajouter un candeactivate méthode pour chaque composant que vous souhaitez ajouter cette option, vous devez d'abord ajouter ce service fichier "désactiver-garde.service.ts":
vous devez alors fournir dans l'application du module:
maintenant dans le composant que vous souhaitez protéger, ajoutez la fonction:
vous pouvez voir que le chargement variable est locale à la composante.
la dernière étape consiste à ajouter la directive du composant dans le module de routage:
et c'est tout, j'espère que cela vous a été utile, goodluck.
DeactivateGuardService
'scanDeactivate
méthode d'obtenir le composant?Merde, bug...Note à moi-même: la prochaine fois, vérifiez le tableau des enjeux première
https://github.com/angular/angular/issues/12851#event-880719778