angular2-routing

I want to have the following routes in my application: export const routes: Routes = [ { path: ':universityId', component: UniversityComponent, children: [ { path: 'info', component: UniversityInfoComponent }, { path: 'courses/:status', component: CoursesByStatusComponent } ] } ] Being on /1/info or /1/courses/open url, how do I change :universityId only from UniversityComponent ? Simple router.navigate(['../', 2], {relativeTo: currentRoute }) won't do because it redirects to /2 , losing all other information. Using '../2/courses/open is also not an option - I can be on any child route at that

We have a client that is iFraming in our app to their website. They don't want the router navigation within our app to affect the back button navigation for their own site. We've tried a couple methods including using post messages to try and have the iFrame communicate with the parent window whenever a history.back() is triggered. My question is if there is any easy way to not affect the browser's history when using Angular 2's router. As far as I know, I couldn't find anything within Angular 2's advanced router documentation: https://angular.io/docs/ts/latest/guide/router.html It turns out

Im using this: import { HttpParams } from '@angular/common/http'; let params = new HttpParams(); params.append('newOrdNum','123'); But this is not working, i dont append param in url. Any suggestion? Jota.Toledo This could be archived by using the Router class: Using a component: import { Router, ActivatedRoute } from '@angular/router'; @Component({}) export class FooComponent { constructor( private _route: ActivatedRoute, private _router: Router ){} navigateToFoo(){ // changes the route without moving from the current view or // triggering a navigation event, this._router.navigate([], {

Is it possible to change a single route parameter in the current route, while keeping all the other parameters? This is for use in a paging component, which will route to a new page while keeping the other parts of the current route the same. Some examples: Default page to page 2: orders?foo=foo&bar=bar > orders?foo=foo&bar=bar&page=2 Default page to page 2 (child): orders/;foo=foo;bar=bar > orders/;foo=foo;bar=bar;page=2 Page 2 to 3 on child and parent with parameters: orders/;foo=foo;page=2?bar=bar > orders/;foo=foo;page=3?bar=bar I have tried using a routerLink , however this loses any

I have a component in angular 2 which responds to changes in the route parameters (the component doesn't reload from scratch because we're not moving out of the main route. Here's the component code: export class MyComponent{ ngOnInit() { this._routeInfo.params.forEach((params: Params) => { if (params['area']){ this._pageToShow =params['area']; } }); } } This works a treat and _pageToShow is set appropriate on navigation. I'm trying to test the behaviour on a change to the route (so a second trigger of the observable but it's refusing to work for me.) Here's my attempt: it('sets PageToShow to

Angular Community! I'm currently rewriting AngularJS app to Angular 2. I want to solve problem which could be described as: route tabs + child routes. So, basically Router in Angular 2 destroys inactive components (my tabs!). The problem is I don't want this behaviour. Reason is I have some components like charts and data grid and want to switch between them fast, I don't want to recreate them. I have found some workaround to persist my tabs while having routes but using this approach I don't know how to implement child routes . I'd like to also have a solution depth-independent (meaning:

My module.ts, import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { RouterModule,Router } from '@angular/router'; import { AppComponent } from './crud/app.component'; import { Profile } from './profile/profile'; import { Mainapp } from './demo.app'; import { Navbar } from './header/header'; // import {ToasterModule, ToasterService} from 'angular2-toaster'; import { FormsModule, ReactiveFormsModule } from '@angular/forms'; @NgModule({ imports: [ BrowserModule,FormsModule, ReactiveFormsModule , RouterModule.forRoot([ { path: '', component

I've created a CanDeactivate guard which returns an observable and it's applied to a component which is loaded in a inner nested router-outlet. Should this guard be called whenever one tries to navigate to another url? I'm asking this because this is not happening in my case. In my case, the guard will only get called for the first "different" URL. Let me try to explain it with an example. Assume I'm always returning false and I'm trying to navigate to different urls from the same component: /A --> guard called /B --> guard called /B --> no navigation and no guard called /A --> guard called /A

In my app some URLs take the form /department/:dep/employee/:emp/contacts In my sidebar I show a list of all employees, each of which has a [routerLink] which links to that employee's contacts <ul> <li> <a [routerLink]="['/department', 1, 'employee', 1, 'contacts']"></a> <li> <li> <a [routerLink]="['/department', 1, 'employee', 2, 'contacts']"></a> <li> ... </ul> However, with this approach I always need to provide the full path, including all the params (like dep in the above example) which is quite cumbersome. Is there a way to provide just part of the route, such as <a [routerLink]="[