example - router events angular 6

Angular 2 consigue la ruta actual en guardia.

Question

Tengo una clase de AccessGuard en mi proyecto cuyo trabajo es determinar si el usuario puede acceder a la ruta o no. Utilicé router.url para obtener la ruta actual, pero la url devuelve la ruta antes de navegar a la nueva ruta, como estoy en la ruta de los usuarios y hago clic en la ruta de los candidatos para que la url devuelva a los usuarios en lugar de a los candidatos que quiero. Para validar el acceso a la ruta este es mi archivo de ruta:

const routes:Routes = [
{
path:'''',
component:PanelComponent,
canActivate:[AuthGuard,AccessGuard],
canActivateChild:[AuthGuard,AccessGuard],
children:[
{
path:''dashboard'',
component:DashboardComponent
},
{
path:''users'',
component:UsersComponent
},
{
path:''users/:id'',
component:ShowUserComponent
},
{
path:''candidates'',
component:CandidatesComponent
},
{
path:''permissions'',
component:PermissionsComponent
},
{
path:''holidays'',
component:HolidaysComponent
},
{
path:''candidate/:id'',
component:CandidateComponent
},
{
path:''salary/create'',
component:InsertSalaryComponent
},
{
path:''document/create'',
component:InsertDocumentComponent
},
{
path:''leave/create'',
component:InsertLeaveComponent
}
]
}
];

y este es mi guardia de acceso:

permissions;
currentRoute;
constructor(private authService:AuthService,private router:Router){
this.permissions = this.authService.getPermissions();
}
canActivate(){
return this.checkHavePermission();
}
canActivateChild(){
console.log(this.router.url);
return this.checkHavePermission();
}
private checkHavePermission(){
switch (this.router.url) {
case "/panel/users":
return this.getPermission(''user.view'');
case ''/panel/dashboard'':
return true;
case ''/panel/candidates'':
return this.getPermission(''candidate.view'');
default:
return true;
}
}
getPermission(perm){
for(var i=0;i<this.permissions.length;i++){
if(this.permissions[i].name == perm ){
return true;
}
}
return false;
}

Answer 1

Debe utilizar los parámetros del método para ver la ruta de destino:

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
console.log(state.url);//''candidates''
}
canActivateChild(childRoute: ActivatedRouteSnapshot, state: RouterStateSnapshot)

Answer 2

La URL actual se puede devolver desde RouterStateSnapshot como se muestra a continuación,

 import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from ''@angular/router'';
canActivate(next: ActivatedRouteSnapshot, state: RouterStateSnapshot){
console.log(state.url);
...
}

Answer 3

esto podría ayudarte

1. Importar ActivatedRouteSnapshot y RouterStateSnapshot :

   import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from ''@angular/router'';

2. Firma en el canActivate :

   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):Observable {}

3. Compruebe el estado :

   console.log("route-access",state);

Su archivo Guard se vería algo así:

 import { Injectable } from ''@angular/core'';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot} from ''@angular/router'';
import { Observable } from ''rxjs'';
import { AutenticacionService } from ''app/services/index'';
@Injectable()
export class AuthGuard implements CanActivate {
constructor(private _router: Router, private auth:AutenticacionService) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot):Observable<boolean> {
// console.log("route-access",state);
let _url:string="";
state.url.split("/").forEach(element => {
if(_url==="")
if(element!=="")
_url=element;
});
// console.log(_url);
return this.auth.check(_url)
.map((result) => {
if (result) {
return true;
} else {
this._router.navigate([''/'']);
return false;
}
});
}
}