title: Angular 5 Navigation Cancelled with Guard
body: <p>I have my routing configured as mentioned below.</p>
  
  <pre><code>const PUBLIC_ROUTES: Routes = [
  { path: '', redirectTo: 'login', pathMatch: 'full' },
  { path: 'login', component: LoginComponent },
  { path: 'session-transfer/:id', component: SessionTransferComponent }
  ];
  
  const SECURE_ROUTES: Routes = [
  { path: 'clients', component: ClientSelectionComponent },
  { path: 'app/:application', component: SessionTransferComponent },
  { path: 'applications', component: AppSelectionComponent },
  { path: '', redirectTo: 'clients', pathMatch: 'full' }
  ];
  
  const routes: Routes = [
  { path: 'st/:transferId',canActivate: [AuthGuard], canActivateChild: [AuthGuard], children: SECURE_ROUTES },
  { path: '', redirectTo: '/login', pathMatch: 'full', },
  { path: '', component: PublicComponent, children: PUBLIC_ROUTES },
  { path: '', component: SecureComponent, canActivate: [AuthGuard], canActivateChild: [AuthGuard], children: SECURE_ROUTES }
  ];
  
  @NgModule({
  imports: [RouterModule.forRoot(routes, { useHash: true })],
  exports: [RouterModule]
  })
  </code></pre>
  
  <p>Following is my sample AuthGuard code</p>
  
  <pre><code>_canActivate() {
    return true;
  }
  
  canActivate(
  next: ActivatedRouteSnapshot,
  state: RouterStateSnapshot): Observable&lt;boolean&gt; | Promise&lt;boolean&gt; | 
  boolean {
  
  return this._canActivate();
  }
  
  canActivateChild(
  next: ActivatedRouteSnapshot,
  state: RouterStateSnapshot): Observable&lt;boolean&gt; | Promise&lt;boolean&gt; | 
  boolean {
       return this._canActivate();
  }
  </code></pre>
  
  <p>When I navigate to route <code>st/:transferId/app/:application</code> the navigation cancels. In the trace log GuardCheckEnd <code>ShouldActivate</code> returning true. Even then the nvigation cancels and redirects to <code>/login</code> route.</p>
  
  <p>Can anyone please help. Thanks</p>