首页 文章

Angular 6路由与延迟加载

提问于
浏览
-2

我有一个github项目可以解释这个问题

Get Project Here

const routes: Routes = [
  {
    path: 'admin',
    loadChildren: './admin/admin.module#AdminModule'
  },
  {
    path: '',
    component: HomeComponent
  }
];

这是来自管理模块路由

const routes: Routes = [{
  path: '',
  component: OverviewComponent
},
  {
    path: 'users',
    component: UserComponent
  }];

该项目具有home组件,url中没有路径

  • http://localhost:4200但它正在加载延迟加载的admin模块中定义的空路径(OverviewComponent) .

根据我的理解,所有延迟加载的url路径应该是

即使没有模块前缀,我看到url路径正在工作 .

提前致谢 .

2 回答

  • 0

    这是因为您已在app模块中导入并声明了管理组件 . 如果你想延迟加载更改app.module.ts文件如下

    @NgModule({
      declarations: [
        AppComponent,
        HomeComponent
    
      ],
      imports: [
        BrowserModule,
        AppRoutingModule
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }
    

    和admin.module.ts如下

    @NgModule({
      imports: [
        CommonModule,
        AdminRoutingModule
      ],
      declarations: [OverviewComponent, UserComponent]
    })
    export class AdminModule { }
    
  • 0

    在AdminModule中,您也应该在admin.component.html中 .

    您还需要为此创建AdminComponent .

    供参考:https://www.tektutorialshub.com/angular-child-routes-nested-routes/

相关问题