angular2-routing

I have a dashboard application which consists of a treeview component (which lists various content nodes) and a dashboard-edit component which renders some editable content depending on which branch of the tree is selected. e.g. The tree is like this: - Football - - Premier League - - - Arsenal - - - Chelsea - - - ...etc - - Championship - - - Derby - - - ...etc You click 'Arsenal' in the tree and it renders some content for that team in an editable panel on the page. The component which renders the sub-components is like this: @Component({ selector: 'my-dashboard', template: ` <div class=

I am creating one angular2-meteor app. export const routes: Route[] = [{ path: '', redirectTo: "login", pathMatch: "full" }, { path: 'login', component: LoginComponent }, { path: 'csvtemplate', component: TemplateComponent, canActivate: ['canActivateForLoggedIn'], children: [{ path: '', redirectTo: 'dashboard' <----how to add condition for multiple path }, { path:'dashboard', component: DashboardComponent }, { path: 'csvtimeline/:month/:year', component: CsvTimelineComponent }, { path: 'csvjson', component: CsvJsonComponent }] }]; When i login to my app using LoginComponent it will go to

My router link works from the root component and the same link not working if I move the links to child component. The plunker code shows the working link and non working link. Thank you in advance. The below is the not working links. //our root app component import {Component} from '@angular/core' @Component({ selector: 'my-menu', template: ` <div> <a routerLink="/comp11" routerLinkActive="active">Crisis Center</a> | <a routerLink="/comp12" routerLinkActive="active">Heroes</a> | <a routerLink="/comp21" routerLinkActive="active">Heroes</a> | <a routerLink="/comp22" routerLinkActive="active"

I am working on an Angular2 app. It uses "@angular/common": "2.0.0-rc.4" and "@angular/router": "3.0.0-beta.2". My problem is that when I use the browser refresh on some of the pages I see an error saying... " The resource you are looking for has been removed, had its name changed, or is temporarily unavailable." This also happens if I hit the url directly. An example url is... https://tilecasev2.azurewebsites.net/profile/therichmond However if you view pages via the homepage they work ok but only until refreshed ( https://tilecasev2.azurewebsites.net ). I have the below in my index.html head.

I'm trying to lazy load Angular 2 modules with the router, and I'm having this error: error_handler.js:50 EXCEPTION: Uncaught (in promise): Error: Cannot find module 'app/home/home.module' I tried all the answers that seems to be working for the others, like this one which seems to be a solution for everybody facing this issue, but doesn't work with me Lazy loading in Angular2 RC7 and angular-cli webpack here is my code: app.module import { MediatorService } from './home/mediator.service'; import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core';

This question already has an answer here: How do I get the absolute path of the current page in Angular 2? 4 answers I have a code in my solution which gets baseHref of an app constructor( private router: Router) { let baseHref = this.router._location._baseHref; You could see what I am getting it via private properties. Is there other way to get base url? aka the url before router added it's parts? I am using angular2 rc4 Thanks The Location class has prepareExternalUrl() that takes base href into account. You can also try to inject constructor(@Inject(APP_BASE_HREF) href:string) It seems APP

I want to achieve something like this /products shows all the products and /products/:category shows all the products related to a specific category. To achieve that I have the following routes: const productsRoutes: Routes = [ { path: 'products', component: ProductsComponent, children: [ { path: '', component: ProductsListComponent, }, { path: ':category', component: ProductsListComponent } ] } ]; Problem When I switch between categories, everything is fine, when I switch between all products and category products, and vice-versa, Angular redraws the components and there's a flickering.

Slowly getting to grips with angular 2 but I've come to dead end on one particular issue. If you have this arrangement; <parent> <child/> </parent> I can notify the child of changes in the parent by using @Input() and get it to listen to changes. I can notify the parent of changes in the child by using the @Output() and EventEmitters. What I'm now looking at is notifying a routed component (a component that is loaded dynamically when a link it clicked) about a specific event that happens in the main appComponent. See example below; <app> <button (click)='addEntity()>Add</button> <router-outlet