Questions tagged [angular-guards]
123 questions
20
votes
9 answers
Angular use modal dialog in canDeactivate Guard service for unsubmitted changes (Form dirty)
In my Angular 4 application I have some components with a form, like this:
export class MyComponent implements OnInit, FormComponent {
form: FormGroup;
ngOnInit() {
this.form = new FormGroup({...});
}
they use a Guard service to prevent…
Francesco Borzi
- 56,083
- 47
- 179
- 252
19
votes
4 answers
How can you use Angular's canActivate to negate the result of a guard?
From the Angular documentation on canActivate, it seems you can only use canActivate guards to allow proceeding to a route if the canActivate function ultimately returns true.
Is there some way to say, "only proceed to this route if the canActivate…
CodyBugstein
- 21,984
- 61
- 207
- 363
7
votes
1 answer
How to redirect from parent route to child route in Angular canActivate guard?
I've got this routes
AppRouting
{
path: 'user',
canLoad: [AuthGuard],
loadChildren: () =>
import('./user/user.module').then((m) => m.PublicUserModule)
}
UserRouting
{
path: '',
component: PublicUserPageComponent,
…
user3887366
- 2,226
- 4
- 28
- 41
7
votes
1 answer
NavigationCancel event thrown for valid guards in Angular 6
I'm having issues with the Angular router during the process of navigating to a provided state.
I have tried using a custom guard with canLoad() and canActivate() functions returning booleans as true without any luck.
The Angular docs states the…
Gjert
- 1,069
- 1
- 18
- 48
6
votes
2 answers
Angular guard for checking if route has state
I have a component to which navigate like this
this.router.navigate(['results'], { state });
and once there i grab the data in the contructor
constructor(private router: Router) {
const { state } = this.router.getCurrentNavigation().extras;
}
i…
Konstantinos Papakonstantinou
- 977
- 3
- 15
- 33
6
votes
1 answer
Can't resolve all parameters for AuthGuard
I have this AuthGuard:
export class AuthGuard implements CanActivate {
constructor (private router: Router) {}
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable | Promise | boolean {
if…
Laiso
- 2,630
- 3
- 16
- 32
5
votes
0 answers
Display parent component of nested route before child resolves (show router-outlet immediately)
I have nested components:
AppComponent
Contains just router-outlet
PageWrapperComponent
Contains just the main-menu and another router-outlet
Requires the main-menu to get loaded from the API before display
ContentComponent
Contains the…
Mick
- 8,203
- 10
- 44
- 66
4
votes
1 answer
How to access RouterStateSnapshot within a functional guard? (Angular 15.1.2)
I'm writing a guard that prevents a user to access a target url whenever he is not authenticated. I'm writing a functional guard to achieve this, however when I try to access the (target) url via the RouterStateSnapshot interface, I receive an empty…
Cedric Debot
- 88
- 7
4
votes
1 answer
Hide the navbar in angular 8 (auth-guard routes are not recorded in routes.event)
All,
Before implementing the auth guard, I was able to hide my Navbar from login and registration screen. By reading the route events in component.ts and hiding the nav-bar by ngIf. After I implemented the auth guard the route made by auth guard to…
Abhinay
- 153
- 4
- 25
4
votes
1 answer
How to prevent actions by user role in Angular
I already have an AuthService to authenticate user on login and AuthGuard to prevent access if not logged in.
Some pages I restrict access by UserProfile/Role but now I need to prevent actions on page.
I have roles like "Admin, Manager, Support…
Renan Ribeiro
- 69
- 1
- 8
4
votes
1 answer
Subscribing to observables in route guards and its implications
I have a router guard called PermissionGuard which is initiated here
const routes: Routes = [
{
path: ':company',
component: CompanyComponent,
canActivate: [PermissionGuard],
canActivateChild: [PermissionGuard],
children: [
…
Gjert
- 1,069
- 1
- 18
- 48
4
votes
4 answers
getting variable data outside subscribe method
I am trying to implement canActivate for user routes, before that I want to check whether the access token is still valid or not. Therefore I implement something like this
export class AuthGuard implements CanActivate {
data:Array
Ashish Jambhulkar
- 1,374
- 2
- 14
- 26
4
votes
1 answer
Angular2, factory guard is possible?
I have a lot of trusts in my website, so to make secure routes I build the next guard:
export class TrustGuard implements CanActivate {
constructor(private router: Router) {
}
canActivate(route: ActivatedRouteSnapshot, state:…
Georgevik
- 539
- 1
- 5
- 18
3
votes
2 answers
Angular router: navigating to different routes according to the user's role
I'm writing a mock e-commerce app which has the following structure:
app
auth
sign-in-page
sign-up-page
auth-routing.module.ts
const routes: Routes = [
{
path: 'signup',
component: SignUpPage,
},
{
path: 'signin',
component:…
Ron Inbar
- 2,044
- 1
- 16
- 26
3
votes
3 answers
When using an Angular route Guard: 'Observable' is not assignable to type > 'Observable'
I'm new to Angular.
How can I solve this problem?
I have installed Angular CLI: 11.0.7 and Node: 12.18.4
I have installed an Angular route guard:
ng g guard auth --skip-tests
The error:
Error: src/app/_guards/auth.guard.ts:15:5 - error TS2322:…
x19
- 8,277
- 15
- 68
- 126