带保护的Angular 5无组件路由无法命中重定向

// app-routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AuthGuard } from './auth.guard';

const routes: Routes = [
  {
    path: 'protected',
    canActivateChild: [AuthGuard],
    children: [
      { path: '', redirectTo: 'redirected', pathMatch: 'full' },
      { path: 'redirected', component: RedirectedComponent }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

// auth.guard.ts
import { Injectable } from '@angular/core';
import { CanActivateChild, Router } from '@angular/router';

@Injectable({
  providedIn: 'root'
})
export class AuthGuard implements CanActivateChild {
  constructor(private router: Router) {}

  canActivateChild(): boolean {
    // Add your authentication logic here
    const isAuthenticated = true; // Example: assume user is authenticated

    if (!isAuthenticated) {
      this.router.navigate(['/login']); // Redirect to login page if not authenticated
      return false;
    }

    return true;
  }
}

// redirected.component.ts
import { Component } from '@angular/core';

@Component({
  template: '<h1>Redirected Component</h1>'
})
export class RedirectedComponent { }