したがって、次のようなモジュール構造があります。
app
----pages
---------dashboard
---------posts
と の両方dashboard
にposts
独自のルーティングがあります。
ルーティングは次のようになります。
ページ
const routes: Routes = [
{
path: '',
component: Pages,
children: [
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
{ path: 'dashboard', loadChildren: './dashboard#DashboardModule' }
{ path: 'posts', loadChildren: './posts#PostsModule' }
]
}
];
export const routing = RouterModule.forChild(routes);
ダッシュボード
const routes: Routes = [
{
path: '',
component: DashboardComponent
}
];
export const routing = RouterModule.forChild(routes);
投稿
const routes: Routes = [
{
path: '',
component: PostsComponent
},
...
];
const routing = RouterModule.forChild(routes);
すべて正常に動作しますが、次PostsModule
のDashboardModule
ようにインポートしようとすると:
import { PostsModule } from '../posts';
@NgModule({
imports: [
routing, // Dashboard routes
CommonModule,
...
PostsModule
]
})
export class DashboardModule { }
と load 、 「兄弟」モジュールをインポートしたという理由だけでなく、がhttp://localhost:3000/#/dashboard
表示されますPostsComponent
DashboardComponent
どうすればこれを修正できますか?