ルータは親コンポーネントのテンプレートを生成していませんか？

Question

ルーティングシステムをベータ/ RC1スタイル（@ angular/router-deprecated）からRC4（@ angle/router）で使用可能なものに移行しようとしています。

私は親ルータのコンポーネントと子の概念を抱いています。私のルーターの親パスに定義されている実際のコンポーネントは、自分のパスのいくつかのためにテンプレートが表示されることはありません。その親は新しいコンテンツを含むラッパーです<router-outlet>

私のダッシュボードのルーティングはうまく動作します。メンバーシップの子を最初にロードすると、DashboardComponentに含まれているラッパーのコンテンツが表示され、各子へのナビゲーションが可能になります。

export const DashboardRoutes: RouterConfig = [ 
    { 
     path: "dashboard", 
     component: DashboardComponent, 
     children: [ 
      { path: "", redirectTo: "membership" }, 
      { path: "executive", component: ExecutivePanelComponent }, 
      { path: "membership", component: MembershipPanelComponent } 
     ] 
    } 
]; 

私のサイトの別のナビゲート可能な領域では、同じように動作しません。ブラウザのURLが正しく表示されますが、空白の画面がレンダリングされます。 ReportCatalogComponentのコンテンツはありません。

export const ReportCatalogRoutes: RouterConfig = [ 
    { 
     path: "catalog", 
     component: ReportCatalogComponent, 
     children: [ 
      { path: "", component: EmptyComponent }, 
      //{ path: "report/:id", component: ReportDetailsComponent, data: { create: false } }, 
      { path: "report", component: ReportDetailsComponent, data: { create: true } } 
     ] 
    } 
]; 

私はここで間違っていますか？

Answer 1

問題を単純化するためにさらに深く掘り下げて試した結果、私はこれの原因に遭遇したと思います。

私の親パスには、次のように参照されたディレクティブが含まれていました。

import { ReportTileComponent } from "./index"; 

この問題を解決するソリューションは、少なくとも他の潜在的な問題をすべて除去した後、コンポーネントを直接参照するように見えます。

import { ReportTileComponent } from "./main/report-tile.component"; 

この理由は非常に難解ですが、私の問題を解決しました。