How to handle query parameters in angular 2

RouteParams are now deprecated , So here is how to do it in the new router. this.router.navigate([‘/login’],{ queryParams: { token:’1234′}}) And then in the login component you can take the parameter, constructor(private route: ActivatedRoute) {} ngOnInit() { // Capture the token if available this.sessionId = this.route.queryParams[‘token’] } Here is the documentation

Change route params without reloading in Angular 2

As of RC6 you can do the following to change URL without change state and thereby keeping your route history import {OnInit} from ‘@angular/core’; import {Location} from ‘@angular/common’; // If you dont import this angular will import the wrong “Location” @Component({ selector: ‘example-component’, templateUrl: ‘xxx.html’ }) export class ExampleComponent implements OnInit { constructor( private location: … Read more

Angular 2 router resolve with Observable

Don’t call subscribe() in your service and instead let the route subscribe. Change return this.searchService.searchFields().subscribe(fields => { to import ‘rxjs/add/operator/first’ // in imports return this.searchService.searchFields().map(fields => { … }).first(); This way an Observable is returned instead of a Subscription (which is returned by subscribe()). Currently the router waits for the observable to close. You can … Read more

Angular 2 passing object via route params possible?

Just use a shared service and add it to the providers: […] of the parent component. Simple service class @Injectable() export class ReservationService { reservation:Reservation; } In parent add it to the providers and inject it in the constructor @Component({… providers: [ReservationService] export class Parent { constructor(private reservationService:ReservationService) {} someFunction() { reservationService.reservation = someValue; } … Read more

Angular2 router.navigate refresh page

You are probably calling the router.navigate function inside a click event. <button class=”btn btn-default” (click)=”save()”>Save</button> And the save function being something like save() { //Do stuff this._router.navigate([“https://stackoverflow.com/users”, { id: userId } ]); } This works on IE11 and Edge browsers, but would reload the application in Chrome. This is because of a missing type in … Read more

Angular2 router keep query string

I don’t think there is a way to define that in the routes configuration. Currently it is supported for routerLinks and imperative navigation to enable preserveQueryParams and preserveFragment You can add a guard to the empty path route, where in the guard navigation to the /comp1 route is done. router.navigate([‘/comp1’], { preserveQueryParams: true }); //deprecated. … Read more