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

This is late, but i hope it might help someone else, as I had struggled with this also.

So, another reason this could be happening is that the navigation event is triggered twice.

This happened to me by mistake, because i had a component with a routerLink directive that had an input binding with the same name:

my-component Class:

@Input() routerLink: string[];

my-component Template:

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

The parent component template was like this :

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

Which was actually creating another routerLink directive binding. As a result the navigation event was firing twice, almost simultaneously, which produced the NavigationCancel event.

In my case the reason was an empty children path with an additional guard.

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

In the given example AuthGuard and YGuard must be true to access the Dashboard component.