Questions tagged [angular2-router]

119 questions
118
votes
5 answers

Do I have to unsubscribe from ActivatedRoute (e.g. params) observables?

I find many examples where ActivatedRoute Observables like params or url are subscribed but not unsubscribed. constructor(private route: ActivatedRoute) {} ngOnInit() { this.route.params // (+) converts string 'id' to a number …
hgoebl
  • 12,637
  • 9
  • 49
  • 72
94
votes
3 answers

What is the difference between ActivatedRoute and ActivatedRouteSnapshot in Angular4

What is the difference between ActivatedRouteSnapshot and ActivatedRoute in Angular 4? It's my understanding that ActivatedRouteSnapshot is a child of ActivatedRoute, meaning that ActivatedRoute contains ActivatedRouteSnapshot. Incidentally, I tried…
RajnishCoder
  • 3,455
  • 6
  • 20
  • 35
71
votes
4 answers

How do I navigate to a sibling route?

Let's presume I got this router config export const EmployeeRoutes = [ { path: 'sales', component: SalesComponent }, { path: 'contacts', component: ContactsComponent } ]; and have navigated to the SalesComponent via this…
Thorsten Westheider
  • 10,572
  • 14
  • 55
  • 97
64
votes
7 answers

Angular: append query parameters to URL

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?
None
  • 8,817
  • 26
  • 96
  • 171
61
votes
15 answers

Get current route without parameters

I need to get my current route without params in Angular 2, I found a way to get the current route with params as follows: this.router.url and then split it: this.router.url.split(';')[0] But this looks as workaround, I think there should be…
Sabri Aziri
  • 4,084
  • 5
  • 30
  • 45
23
votes
4 answers

How to refresh a route's resolved data

Consider the following route configuration: const routes: Routes = [ { path: '', component: AppComponent, resolve: { app: AppResolver }, children: [ { path: 'user/:uid', resolve: { user:…
vlaurin
  • 243
  • 1
  • 2
  • 7
23
votes
6 answers

Angular 2: How to conditionally load a Component in a Route asynchronously?

I'd like to attach a component to a route asynchronously, given a condition. The following example, which works (but is asynchronous), loads one component or another depending on the user role: import { UserDashboardComponent } from…
Alex JM
  • 1,084
  • 2
  • 11
  • 32
22
votes
3 answers

Angular2 router, get route data from url, to display breadcrumbs

I am using angular2 router. To draw the breadcrumb of an url, lets say site.com/a/b/c/15 I do the following: Get the route of site.com/a/b/c/15 and get the pretty name associated to the route Get the route of site.com/a/b/c and get the pretty name…
ATX
  • 1,139
  • 2
  • 11
  • 29
19
votes
1 answer

Angular2 Router: Cannot find primary outlet to load 'HomeComponent'

tried to switch to new Router as in version "@angular/router": "3.0.0-beta.2" in combination with "@angular/*": "2.0.0-rc.4", following the official docs on the ComponentRouter. However, I'm facing an issue when trying to load my App with the…
Thorsten Viel
  • 1,199
  • 1
  • 10
  • 18
16
votes
4 answers

In Angular, how I navigate directly to a path inside a lazy loaded module?

I would like to have two top level paths for logging in and registering. I would prefer not having to do auth/log-in and auth/register. However, the auth components are in a separate module, which is good because it shouldn't be loaded unless…
CodyBugstein
  • 21,984
  • 61
  • 207
  • 363
14
votes
2 answers

Angular2 Router: Error: Cannot find primary outlet to load 'InboxComponent'

I created a simple app with routing. Links "http:// localhost:4200" and "http:// localhost:4200/mail" work well, but when I try to open a link "http:// localhost:4200/mail/inbox" I get an error: "Cannot find primary outlet to load…
Zurab
  • 1,411
  • 3
  • 17
  • 39
8
votes
1 answer

Parallel (Asynchronous Non Blocking) Routing In Angular 2/4

The application has a page with 2 to 3 category buttons. Basically, button click will pull the list of items in each category, the page should be shown once API fetched data is available. I have designed angular 2 app routes with resolve API calls…
8
votes
2 answers

Angular: resolve all route segments configuration by URL

Given a URL, e.g. /path/path2/path3/123;sdf=df and a routes configuration: { path: 'path', data: { g: 'h' }, children: [ { path: 'path2', data: { c: 'd' }, children: [ { path: 'something', component: TestpageComponent, data: { a: 'b' } }, …
smnbbrv
  • 23,502
  • 9
  • 78
  • 109
8
votes
2 answers

How can I specify query parameters by routerLink directive

I am experimenting the new router (version 3.0.0-alpha.7) and would like to know how to specify query parameters by routerLink directive? The Router.navigate() method below generates a URL like…
7
votes
2 answers

Angular2 Router: Get Route for URL without navigating

I want to display/hide routerLinks based on some Data from the router. The directive is done, but I'm missing the most essential part... For example I have the following router config (omitted components): [ { path: '', children: [ { path:…
Benjamin M
  • 23,599
  • 32
  • 121
  • 201
1
2 3 4 5 6 7 8