角度默认路由给空页面而不是去comonant

Question

按应用程序包含应用组件 .html

<router-outlet></router-outlet>

带路由器

const routes: Routes = [

 {
 path: '',
 component: LandingPageComponent,
 canActivate: [AuthGuard],
 children: [

  {
    path: 'dashboard',
    canActivate: [AuthGuard],
    component: DashboardComponent
  },
  {
    path: '',
    canActivate: [AuthGuard],
    component: DashboardComponent,
  },

]
 },
 {
  path: 'login',
  component: LoginComponent
 },
 {
  path: '**',
  redirectTo: 'dashboard'
 }


 ];

登陆页面代码

   <!-- side bar menu -->
 <sidebar #sideBar id="sideBar"></sidebar>
   <!-- /side bar menu -->
  <!-- top navigation -->
   <topbar></topbar>
   <!-- /top navigation -->

 <!-- page content -->
   <router-outlet></router-outlet>
  <!-- /page content -->

 <!-- footer content -->
  <bottomfooter></bottomfooter>
   <!-- /footer content -->

我的守卫

    @Injectable({ providedIn: 'root' })
    export class AuthGuard implements CanActivate {
      constructor(private router: Router, private authService: AuthService) { }
      canActivate() {
        return this.authService.user.pipe(
          map(user => {
            if (user) return true;

            this.router.navigate(['/login']);
            return false;
          }));
      }
    }

一切正常，除了默认路由，它假设直接到仪表板，但它给了我带有侧面和顶部导航栏的空白页面

任何建议我如何解决这个问题