触发 NavigationCancel 事件的所有原因可能是什么？

Question

我订阅了 angular2 中的路由器事件，当我控制这些事件时，我发现 NavigationCancel 事件带有 reason: ""。很想知道触发 NavigationCancel 的所有可能原因。不仅有 empty 原因，而且一般来说。

Answer 1

NavigationCancel 将在您尝试导航到一条路线时触发，而无法加载已导航的路线子项（CanLoad 守卫）或路线本身无法激活（CanActivate 守卫）

您可以在配置 RouterModule 时使用 {enableTracing : true} 查看所有事件，并进一步分析。

希望对您有所帮助！！

Answer 2

来晚了，但我希望它能对其他人有所帮助，因为我也曾为此苦苦挣扎。

因此，发生这种情况的另一个原因是导航事件被触发了两次。

我误会了这件事，因为我有一个带有 routerLink 指令的组件，该指令有一个同名的输入绑定：

my-component Class:

@Input() routerLink: string[];

my-component 模板：

...
<a [routerLink]="routerLink">
...

父组件模板是这样的：

...
<my-component
   [routerLink]="somePath"
   ...
>

这实际上是在创建另一个 routerLink 指令绑定。结果，导航事件几乎同时触发了两次，从而产生了 NavigationCancel 事件。

Answer 3

在我的例子中，原因是一个空的子路径有一个额外的守卫。

{
path: '',
canActivate: [AuthGuard],
component: Dashboard,
children: [
  {
    path: 'x',
    canActivate: [XGuard],
    component: XComponent
  },
  {
    path: '',
    canActivate: [YGuard],
    children: [
      {
        path: 'z',
        loadChildren: async () => ...,
        canActivate: [ZGuard],
      },
    ]
  }
]
}

在给定的示例中，AuthGuard 和 YGuard 必须为真才能访问仪表板组件。

触发 NavigationCancel 事件的所有原因可能是什么？

What all could be the reasons for a NavigationCancel event to get triggered?

angular2-routing

angular