私はすべての機能がそれ自身のモジュールを持っているアプリケーションを書いています（機能はページかページの一部である可能性があります）。これは、すべての機能に独自のドメインロジック、サービス、ディレクティブおよびコンポーネントを持たせるためです。つまり、ダッシュボードモジュールには、ログインやプロファイルなどの他のビューに公開したくないChartComponentウィジェットがあります。
問題は、Angular 2のルーティングで作業するときに、モジュールではなく特定のコンポーネントに常にルーティングすることです。
私たちの場合、パスのルートを設定するには、 '/ dashboard'コンポーネント：DashboardComponentをapp.module.tsに宣言する必要がありますが、それでも問題はありませんが、モジュールapp.moduleにあるので、CharComponentは公開されず、ダッシュボードコンポーネントはapp.module.tsではなくdashboard.module.tsで宣言されているため、DashboardComponentでレンダリングされません。
ChartComponentをapp.module.tsに宣言すると、それはうまくいくはずですが、アプリケーションのアーキテクチャが失われました。
アプリケーションのファイル構造は次のようになります。
└─ src/
└─ app/
├─ app.module.ts
├─ app.component.ts
├─ app.routing.ts
├─ profile/
| ├─ profile.module.ts
| └─ profile.component.ts
├─ login/
| ├─ login.module.ts
| └─ login.component.ts
└─ dashboard/
├─ dashboard.module.ts
└─ dashboard.component.ts
└─ chart/
└─ chart.component.ts
メイン（アプリ）モジュールにコンポーネントをインポートする必要はありませんが、
遅延をロードする場合は、以下のようなパスを定義するだけで済みますが、
// In app module route
{
path: 'dashboard',
loadChildren: 'app/dashboard.module#DashboardModule'
}
// in dashboard module
const dashboardRoutes: Routes = [
{ path: '', component: DashboardComponent }
];
export const dashboardRouting = RouterModule.forChild(dashboardRoutes);
@NgModule({
imports: [
dashboardRouting
],
declarations: [
DashboardComponent
]
})
export class DashboardModule {
}
または
あなたは、DashboardModuleルートが遅延ロードされていなければ動作します。
@NgModule({
imports: [
BrowserModule,
FormsModule,
DashboardModule,
routing
],
declarations: [
AppComponent
],
providers: [
appRoutingProviders
],
bootstrap: [ AppComponent ]
})
export class AppModule {
}
お役に立てれば！！
レイジーローディングはRC5で正常に動作せず、RC6にアップグレードされただけですべてが機能することが判明しました。
そのロジックはいいですが、私は将来、機能のオン/オフを切り替えるためのアカウント管理コンポーネントモジュールにすべての権限を入れていますが、ユーザーがあなたのアカウントをアップグレードするために必要なすべての権限を持つことは望ましくありません。未来。拡張性と、システムが実際にそのロジックに熱心である場合には、将来のコーディングから節約することができます。