angular - 你如何使用 Angular 的 canActivate 来否定守卫的结果？

Question

From the Angular documentation在 canActivate , 看来你只能使用 canActivate如果 canActivate函数最终返回 true .

有没有什么方法可以说“只有在 canActivate 类的计算结果为 false 时才继续执行这条路线”？

例如，为了不允许登录用户访问登录页面，我试过这个但没有用:

export const routes: Route[] = [
    { path: 'log-in', component: LoginComponent, canActivate: [ !UserLoggedInGuard ] },

我在控制台中收到此错误:

ERROR Error: Uncaught (in promise): Error: StaticInjectorError[false]: 
  StaticInjectorError[false]: 
    NullInjectorError: No provider for false!
Error: StaticInjectorError[false]: 
  StaticInjectorError[false]: 
    NullInjectorError: No provider for false!

Answer 1

你的问题中有趣的是公式:

Is there some way to say, "only proceed to this route if the canActivate class evaluates to false" ?

以及您如何表达“直观”的解决方案:

{ path: 'log-in', component: LoginComponent, canActivate: [ !UserLoggedInGuard ] },

基本上就是说，您需要否定UserLoggedInGuard@canActivate的结果

让我们考虑以下 UserLoggedInGuard 的实现:

@Injectable()
export class UserLoggedInGuard implements CanActivate {
   constructor(private _authService: AuthService) {}

   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        return this._authService.isLoggedIn();
    }
} 

接下来我们看看@Mike提出的方案

@Injectable()
export class NegateUserLoggedInGuard implements CanActivate {    
    constructor(private _authService: AuthService) {}

   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
        return !this._authService.isLoggedIn();
    }
}

现在，该方法没问题，但与 UserLoggedInGuard 的(内部)实现紧密耦合。如果由于某种原因 UserLoggedInGuard@canActivate 的实现发生变化，NegateUserLoggedInGuard 将中断。

我们如何避免这种情况？简单的滥用依赖注入(inject):

@Injectable()
export class NegateUserLoggedInGuard implements CanActivate {    
  constructor(private _userLoggedInGuard: UserLoggedInGuard) {}

  canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
     return !this._userLoggedInGuard.canActivate(route,state);
  }
}

现在这完全您表达的意思

canActivate: [ !UserLoggedInGuard ]

最精彩的部分:

• 它与 UserLoggedInGuard 的内部实现没有紧密耦合
• 可以扩展以操作多个 Guard 类的结果