2017-11-21 9 views
0

私はこれを数時間見てきましたが、私は何が間違っているのか分かりません。ここに私のシナリオです: 私はメインモジュールと管理モジュールを持っているAngular 4アプリケーションを持っています。これは遅れてロードされています。 Adminコンポーネントのテンプレートに別のルータを定義して、管理機能のすべての補助ルートをロードできるようにしたいと考えています。ここで角4は補助ルート付きのモジュールです

私app.moduleルートの設定です:

const routes: Routes = [ 
    { path: '', redirectTo: 'dashboard', pathMatch: 'full' }, 
    { path: 'home', component: HomeComponent }, 
    { 
     path: 'dashboard', component: DashboardComponent, canActivate: [CanActivateGuard] 
    }, 
    { path: 'admin', loadChildren: '/app/components/admin/admin.module#AdminModule', canActivate: [AdminGuard] }, 
    { path: '**', redirectTo: 'dashboard' } 
]; 

とadmin.module:

<router-outlet name="admin"></router-outlet> 
:私のように名前のルータを定義したadminDashboard.htmlで

const routes: Routes = [ 
    { 
     path: '', component: AdminDashboardComponent, children: [ 
      { path: 'employees', component: EmployeeManagerComponent, outlet: 'admin' } 
     ] 
    } 
] 

と定義されたリンクもあります。

<a [routerLink]="[{ outlets: { 'admin': ['employees']}}]">Employee Manager</a> 

管理ダッシュボードに移動すると、モジュールがロードされ、ダッシュボードが表示されます。名前付きルーターにEmployeeManagerComponentをロードするリンクをクリックすると、何も起こりません。 urlはlocalhost:5000/admin /(admin:employees)に変更されますが、EmployeeManagerComponentは表示されません。コンソールにエラーは記録されません。

何か不足していますが、何が分かりません。

ありがとうございました。

答えて

0

なので、試行錯誤の末、遅延ロードされたadminDashboardコンポーネントのルータ出口に名前を付ける必要はありませんでした。 Angularは、モジュール内の子ルートがモジュール内の主コンポーネントに最も近いコンセントに配置されることを理解するのに十分スマートです。名前だけを削除し、

<a [routerLink]="['employees']">Employees</a> 

としてリンクを設定するので、

は、トリックを行いました。

関連する問題