2

したがって、次のようなモジュール構造があります。

app 
----pages
---------dashboard
---------posts

と の両方dashboardposts独自のルーティングがあります。

ルーティングは次のようになります。

ページ

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);

すべて正常に動作しますが、次PostsModuleDashboardModuleようにインポートしようとすると:

import { PostsModule } from '../posts';

@NgModule({
  imports: [
    routing, // Dashboard routes
    CommonModule, 
    ...
    PostsModule
  ]
})
export class DashboardModule { }

と load 、 「兄弟」モジュールをインポートしたという理由だけでなく、がhttp://localhost:3000/#/dashboard表示されますPostsComponentDashboardComponent

どうすればこれを修正できますか?

4

1 に答える 1