遅延ロードされたモジュール間のルーティング

Question

私は2つのセクションを持つアプリケーションで作業しています。パブリックおよびプライベート（認証および非認証）セクション。

私の主なappルートがそうのように定義されています。

const appRoutes: Routes = [ 
    { 
    path: '', 
    redirectTo: '/public/login', 
    pathMatch: 'full' 
    }, { 
    path: 'public', 
    loadChildren: 'app/public/public.module#PublicModule', 
    }, { 
    path: 'private', 
    loadChildren: 'app/private/private.module#PrivateModule' 
    } 
]; 

はその後PublicModuleに私が持っている：私のプライベートモジュールで

const publicRoutes: Routes = [ 
    { 
     path: '', 
     component: FullscreenComponent, 
     children: [ 
      { 
       path: 'login', 
       component: LoginComponent, 
      }, 
      { 
       path: 'unlock', 
       component: UnlockComponent 
      } 
     ] 
}]; 

と同じもののようなものを：

const privateRoutes: Routes = [ 
    { 
     path: '', 
     component: PrivatePageComponent, 
     children: [ 
      { 
       path: 'dashboard', 
       component: DashboardComponent, 
       canActivate: [AuthGuard] 
      }, { 
       path: 'general', 
       component: GeneralComponent, 
       canActivate: [AuthGuard] 
      } 
     ] 
    } 
]; 

私が立ち往生しているところは、デフォルトのルーティングです。ユーザーが/を要求すると、これは/public/loginにリダイレクトされると予想していましたが、そうではありません。それは/にとどまります。私が/public/loginに直接ナビゲートすると、私は見たいものを見ます。

私は何が欠けているのか分かりません。

私が持っている副次的な問題/publicは/public/loginを表示しませんが、それはまだ重要ではありません。

ここでのルートの仕組みが分かりません。

私が持っている第3の問題は、/private/dashboardにアクセスしようとすると、/にリダイレクトされることです。私は/リダイレクトを動作させることができれば、これは問題ではないと私は推測します。

Answer 1

変更にappRoutesとpublicRoutes：

AppRoutes

const appRoutes: Routes = [ 
    { 
     path: '', 
     redirectTo: 'public', //<--- Change this route path 
     pathMatch: 'full' 
    }, { 
     path: 'public', 
     loadChildren: 'app/public/public.module#PublicModule', 
    }, { 
     path: 'private', 
     loadChildren: 'app/private/private.module#PrivateModule' 
    } 
]; 

PublicRoutes

const publicRoutes: Routes = [ 
    { 
     path: '', 
     component: FullscreenComponent, 
     children: [ 
      { 
       path: '',    // <--- Add this empty path route 
       redirectTo: 'login' 
      }, 
      { 
       path: 'login', 
       component: LoginComponent, 
      }, 
      { 
       path: 'unlock', 
       component: UnlockComponent 
      } 
     ] 
}]; 

これは3つの問題のあなたの最初の二つを解決する必要があります。