angular2-routing

I have set up routes is like below const appRoutes: Routes = [ { path: 'login', component: LoginComponent, data: { title: 'Login TTX' } }, { path: 'list', component: ListingComponent, data: { title: ' TTX Home Page', module:'list' } }, { path: '', redirectTo: '/login', pathMatch: 'full' }, ]; now when i come to '/list' route then on 'listing.component.ts' i have written below code export class ListingComponent { public constructor(private router:Router) { //here how i can get **data** of **list** routes } } public constructor(private route:ActivatedRoute, private router:Router) { console.log

here is my Angular2 app structure: Here is part of my code. The following is the main module of the Angular2 app, that imports its routing rules and a child module ( EdgeModule ) and uses some components related to some pages. app.module.ts @NgModule({ declarations: [ AppComponent, PageNotFoundComponent, LoginComponent ], imports: [ ... appRouting, EdgeModule ], providers: [ appRoutingProviders, LoginService ], bootstrap: [AppComponent] }) export class AppModule { } Here is the routing rules for the main module. It have paths to login page and page not found. app.routing.ts const appRoutes:

Angular 2 beta uses html5 routing by default. However, when you go to a component and the route changes (eg http://localhost:5000/aboutus ) and you reload/refresh the page, nothing is loaded. The issue has been raised in this post also. Most of the answers say that if we are going to pursue HTML5 routing in angular 2, then this issue of routing should be taken care of in server-side. More discussion here . I am not sure how to handle this issue using the asp.net server environment. Any angular 2 devs out there who also uses asp.net and encounters this issue? PS. I'm using ASP.NET 5. My Angular

I'm trying to navigate to a route in Angular 2 with a mix of route and query parameters. Here is an example route where the route is the last part of the path: { path: ':foo/:bar/:baz/page', component: AComponent } Attempting to link using the array like so: this.router.navigate(['foo-content', 'bar-contents', 'baz-content', 'page'], this.params.queryParams) I'm not getting any errors and from what I can understand this should work. The Angular 2 docs (at the moment) have the following as an example: { path: 'hero/:id', component: HeroDetailComponent } ['/hero', hero.id] // { 15 } Can anyone

I'm working on an app that has a lot of roles that I need to use guards to block nav to parts of the app based on those roles. I realize I can create individual guard classes for each role, but would rather have one class that I could somehow pass a parameter into. In other words I would like to be able to do something similar to this: { path: 'super-user-stuff', component: SuperUserStuffComponent, canActivate: [RoleGuard.forRole('superUser')] } But since all you pass is the type name of your guard, can't think of a way to do that. Should I just bit the bullet and write the individual guard

How to replace a history instead a pushing a new in angular 2's new router (rc.1)? For example Im in a question list ( /questions ) opening a new modal in a new route ( /questions/add ), and after adding a new question I go to the question view ( /questions/1 ). If I press back I would like to go to the /questions instead of /questions/add If you use router.navigate And then location.replaceState With the exact same path, you can trigger changes that usually happen, as well as replacing the history. For example, in your case: this.router.navigate(['questions/1']); this.location.replaceState(