Stack Overflow
Stack Overflow

Questions tagged [angular4-router]

Questions about the Angular 4 Router. Use this to tag questions specific to the Angular 4 Router; which is not to be confused with the outdated Angular 2 Router (router-deprecated) or the Angular 1.x router (angular-ui-router).

Angular router is key to developing multi-page apps with Angular. From Todd Motto's blog:

Angular’s router acts as the main hub of any application, it loads the relevant components relevant to the route requested, as well as dealing with fetching the relevant data for that particular route. This allows us to control different routes, data and the components that render the data (as well as many additional features).

Angular Router 4 has numerous features including:

  • Support for multiple router outlets.
  • Route guards allowing for routes to be reactively disabled.
  • Various mechanisms for storing and parsing data from from the URI including fragments, parameters, and query objects.
321 questions
25
votes
4 answers

routerLink inside angular material

or . I am new to Angular, Trying to use routing with the above Angular material component. But it's not appending…
Deepak
  • 1,670
  • 1
  • 20
  • 20
18
votes
2 answers

Google Analytics and Angular4+ matrix URL parameters

In my Angular4+ app, I'm using matrix notation for URL routing params. Google Analytics strips URLs up to first encountered ';'. I found this but it doesn't help much. Is there a way to make GA read full URLs like this or my only option is to turn…
Mike
  • 809
  • 6
  • 20
18
votes
4 answers

Spring Boot/Angular 4 - Routing in app hits the server

I have an Angular 4 (ES6) app that I want to serve from a Spring Boot application. My Angular app has an index.html, and when the address of http://localhost:8080 is hit, Spring Boot knows to map to the index.html file which in Angular is mapped to…
Black Dynamite
  • 4,067
  • 5
  • 40
  • 75
16
votes
2 answers

Replace chunk name with module name in angular 4 lazy loading

I'm using angular-cli-1.6.3 for bundling my project. I try to rename lazy loaded chunk name into valid module name. But it is not working. Code snippet given below, { path: 'lazy', loadChildren: './lazy/module#LazyModule?chunkName=LazyModule' }
Srigar
  • 1,648
  • 3
  • 14
  • 28
13
votes
4 answers

How to restrict access to Login Route if user is already logged in in Angular 4?

I have successfully implement AuthGuardService which restrict access to a protected route if user is not logged in. What I am trying to achieve is, if user is already logged in and accessed the Login Route, I want it to redirect to another route…
Daniel Chikaka
  • 1,432
  • 4
  • 17
  • 28
13
votes
3 answers

How to route in angular 4

I have an angular 4 project and when I run it from localhost:4200/route-a, it works fine and when I refresh the browser, all works well as expected. However, when I build it with ng build and run it from apache, navigating to localhost/route-a…
Wafula Samuel
  • 530
  • 1
  • 8
  • 25
13
votes
2 answers

Angular 4 Implicit Flow Callback and Router Guard

What is the best way to handle the implicit flow Callback in Angular 4? I want the Guard to wait until the user is redirected back with the token and it is stored before the Guard returns true or false, I'm getting the Access Denied route for a few…
Fab
  • 904
  • 2
  • 14
  • 38
12
votes
5 answers

Angular - Add target to router navigate

What I want to do is to open the target of router navigate in another tab or in a popup. My instruction is this: private router: Router; this.router.navigate(['/page', id]); In routing I have: const routes: Routes = [ { path: '', …
Martina
  • 1,852
  • 8
  • 41
  • 78
11
votes
2 answers

Prevent routerLink action in Angular 2

I have a link: Test link I wanted to do in testClick function something like this: testClick(event:any) { if (..some expression..) { //custom popup confirmation //if true…
Buckethead
  • 213
  • 5
  • 14
11
votes
2 answers

Angular 4 router and modal dialog

I have Angular 4 SPA application using Angular router. I want to have hyperlink that opens a component in new dialog using Bootstrap 4. I already know how to open modal dialog from a function. But how to open it using hyperlink?
Sergiy
  • 1,854
  • 4
  • 22
  • 34
10
votes
4 answers

Router named outlets that are activated once

Is it possible to have router named outlets that are activated once and then never destroyed, no matter what route is navigated in primary outlet? The intention is to have components that persist on page (for instance, sidebar) but get the benefits…
Estus Flask
  • 206,104
  • 70
  • 425
  • 565
10
votes
2 answers

Error: Uncaught (in promise): TypeError: guard is not a function

I am writing an Authguard in Angular 4 to prevent accessing routes without login. However, I am getting this error. Below is the code from Authgaurd and Routing in App module. Please help resolve the issue. //Authgaurd Code import {…
user8300647
  • 335
  • 2
  • 4
  • 10
10
votes
7 answers

Reload Angular 4+ route with the same URL parameter

I've been doing some research into reloading an Angular 4+ route and it looks as if the preferred method is to instead listen to URL parameter changes within the component and re-initialise the component there instead. The issue I'm having is in…
Jamie Street
  • 1,527
  • 3
  • 14
  • 32
10
votes
2 answers

Angular 4: Routing to a route doesn't work

There is some fundamental concept of routing in Angular 4 that I don't understand. index.html: File structure: - app |- app.routings.ts |- collections |-- collection.component.ts |-- collection.component.html |--…
user3255061
  • 1,757
  • 1
  • 30
  • 50
10
votes
4 answers

Angular4 Routing: Force Navigation By Bypassing Route Guard

When my users have dirty changes on a screen, I have a route guard to prompt them to save or discard when they try to navigate away. However, if I am logging them out due to inactivity, I want to force navigation and bypass the route guard (by…
masonk
  • 9,176
  • 2
  • 47
  • 58
1
2 3
…
21 22