angular

Question

我有一个组件，我希望仅在从另一个组件重定向的情况下允许它访问。
因此，如果我将 url 放在浏览器中，它不会允许我访问它，但是，如果我从另一个特定组件重定向到它，它将被允许：

this.router.navigate(['/main/myLockedComponent']);

我想像这样添加一个类似于 authGuard 的 canActivate 守卫：

import { Injectable } from '@angular/core';
import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot, UrlTree } from '@angular/router';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class ValidationGuardService implements CanActivate{

  constructor() { }
  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean  {
    console.log(route);
    console.log(state);
    return true;
  }
}

但是通过打印状态和路由，我找不到我需要的信息，例如 这个组件是否从 angular 组件（最好是从哪个组件）重定向到内部，或者不是.

编辑：我正在使用 angular 11.

Answer 1

如果你想检查你是否从这样的路由重定向 www.testsite.com/main/profile ，你可以在你的守卫中写一个条件

import { Injectable } from '@angular/core';
import { CanActivate, Router} from '@angular/router';
import { Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class ValidationGuardService implements CanActivate{

  constructor(private router : Router) { }
  canActivate(): boolean  {

    let currentUrl = this.router.url;
    let isFromProfile = currentUrl.indexOf('/profile') == -1 ? false : true;
    console.log(currentUrl);
    if(isFromProfile)
       return true;
    else 
       return false;
    }
}

您还可以使用以下方法检查 url 的最后一部分是否是我们期望的：

let isFromProfile = this.router.url.split('/').pop() === 'profile';

希望这能回答您的问题:-)

angular - 如何创建一个 canActivate 守卫以只允许来自另一个组件的重定向？

angular - How to create a canActivate guard to only allow redirects from another component?

angular-routing

angular-router

angular-router-guards

canactivate