angular2-routing

I have a route with two canActivate guards ( AuthGuard and RoleGuard ). The first ( AuthGuard ) checks to see if the user is logged in and, if not, redirects to the login page. The second checks to see if the user has a role defined that is allowed to view the page and, if not, redirects to the un-authorized page. canActivate: [ AuthGuard, RoleGuard ] ... export class AuthGuard implements CanActivate { canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Promise<boolean> { ... this.router.navigate(['/login']); resolve(false); } export class RoleGuard implements CanActivate {

Route const appRoutes: Routes = [ { path: '', redirectTo: '/companies/unionbank', pathMatch: 'full'}, { path: 'companies/:bank', component: BanksComponent }, { path: '**', redirectTo: '/companies/unionbank' } ] Component const NAVBAR = [ { name: 'Banks', submenu: [ { routelink: '/companies/unionbank', name: 'Union Bank' }, { routelink: '/companies/metrobank', name: 'Metro Bank' }, { routelink: '/companies/bdo', name: 'BDO' }, { routelink: '/companies/chinabank', name: 'China Bank' }, ] }, ... ] Example of link: http://localhost:8099/#/companies/bdo I want to get String bdo in the example link

How can I set Bootstrap navbar "active" class in Angular 2? I only found Angular 1 way . When I go to About page, add class="active" to About , and remove class="active" on Home . <ul class="nav navbar-nav"> <li class="active"><a [routerLink]="['Home']">Home</a></li> <li><a [routerLink]="['About']">About</a></li></li> </ul> Thanks If you use the new 3.0.0. component router ( https://github.com/angular/vladivostok ) you can use the routerLinkActive directive. No further javascript required. <ul class="nav navbar-nav"> <li [routerLinkActive]="['active']"> <a [routerLink]="['one']">One</a></li>

I am unit testing a component that is used to edit an object. The object has an unique id that is used in order to grab the specific object from an array of objects that are hosted in a service. The specific id is procured through a parameter that is passed via routing, specifically through the ActivatedRoute class. The constructor is as follows: constructor(private _router:Router, private _curRoute:ActivatedRoute, private _session:Session) { } ngOnInit() { this._curRoute.params.subscribe(params => { this.userId = params['id']; this.userObj = this._session.allUsers.filter(user => user.id

I have an application, which need to separate authenticated and guest users components. But I need, that both components will be loaded by '/' route. I wrote { path: 'desktop', loadChildren: 'app/member/member.module#MemberModule', canActivate: [LoggedInGuard], }, { path: '', loadChildren: 'app/guest/guest.module#GuestModule', canActivate: [GuestGuard], }, And it works. But how to make, that both component load by same url? I had tried to write path: '' for Member's module route, but the second router rule is not performed. Here are guards code: LoggedInGuard: canActivate(route:

This one took me a while to figure out, so I hope to save someone's time by sharing the solution in the SO's Q&A way. Here it goes: Goal I have an Angular8 web application, where I use the RouterModule to navigate between the components. Here is how my routes are defined: const routes: Routes = [ { path: 'moo', component: AppMooComponent, data: { title: 'Moo Section', desc: 'Moo is the first example component.' } }, { path: 'boo', component: AppBooComponent, data: { title: 'Boo Section', desc: 'Boo is the second example component.' } }, { path: 'foo', component: AppFooComponent, data: { title:

I have a component protected with canActivate guard. The Authguard in the checkLogin function subscribes from an observable but I do not know how to return a boolean value from it to canActivate. guard.service.ts canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean { let url: string = state.url; return this.checkLogin(url); } public checkService:boolean; checkLogin(url: string):boolean { return this.loadAppSettings().subscribe(res=>{ console.log(this.checkservice); if (this.checkservice == true) { return true; } else{ this.router.navigate(['/error-user']); return

I'm trying to create an application with hash location strategy, but it does not add the hash to the url. For instance when I click on a button associated with { path: '/polls', name: 'Polls', component: PollsComponent } it loads the page with this url : localhost:3000/polls. What do I have to change to get the hash location strategy? Why do I have to set the default base url if I want to use hash location strategy? This is the routing in the app.component.ts where all the routing is defined: import {Component} from 'angular2/core' import {HTTP_PROVIDERS, Http} from 'angular2/http'; import