Question

看起来Angular Router的所有指南都谈到了重定向到特定路由。但是如果你想根据一些内部逻辑重定向到不同的路由会发生什么呢？

例如：

routes: [
 {path: 'link-from-email/:confirmationToken', customFunction: () => {
    myService.checkTokenStatus(token).subscribe((status) => {
      if(status === PREMIUM_ACCOUNT) {
        router.navigate('premium-welcome-page');
      } else if(status === BASIC_ACCOUNT) {
        router.navigate('basic-welcome-page');
      } else {
        router.navigate('registration-page');
      }
    });
}]

似乎在Angular中执行此操作的标准方法是将路由重定向到组件，该组件根据myService返回的内容在其模板中显示不同的内容。但是有些用例不希望在一个模板中包含它。例如，在上面的示例中，我们可能想要显示三个不同的页面，我们可能觉得在单个组件中包含所有逻辑并不高效。或者，我们可能希望将用户定向到两个不同的流，每个流被组织到单独的目录中，而不是将两个页都包含在一个组件中。

当然，我们可以创建一个带有空模板的虚拟组件，仅用于处理此逻辑。但这似乎效率低下。

有没有办法以某种方式在路线中包含该逻辑？或者我们是否总是需要重定向到组件？

Answer 1

使用canActivate模式

后，你的后卫是什么

routes: [
 {path: 'link-from-email/:confirmationToken', canActivate: [AuthGuard]
}]

然后是AuthGuard组件;

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

@Injectable()
export class AuthGuard implements CanActivate {
    constructor(private router: Router) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        //Your logic here, then call the navigate, your :confirmationToken should be available from the state object
        this.router.navigate(['/url']);
        return false;
    }
}

基于自定义逻辑重定向的路由

1 个答案: