Angular 角度路由器-延迟加载而不丢失url段

Angular 角度路由器-延迟加载而不丢失url段,angular,angular2-routing,Angular,Angular2 Routing,据我所知,角度路由器延迟加载是从url段开始工作的 例如,在中,您将危机中心放在一个单独的模块中,其组件的路径挂起“www.server.org/crisis center/” 但是,如果您想拥有危机中心组件而不挂在“www.server.org/crisis center”url段上,该怎么办 例如,“www.server.org/crisis center”指向CrisisListComponent,“www.server.org/crisis admin”指向CrisisAdminComp

据我所知,角度路由器延迟加载是从url段开始工作的

例如,在中,您将危机中心放在一个单独的模块中,其组件的路径挂起“www.server.org/crisis center/”

但是,如果您想拥有
危机中心
组件而不挂在“www.server.org/crisis center”url段上,该怎么办

例如,“www.server.org/crisis center”指向CrisisListComponent,“www.server.org/crisis admin”指向CrisisAdminComponent

我找不到方法将这两条路由指向同一个延迟加载的模块

有人知道如何在不丢失url的情况下使用延迟加载

其他例子: 让我们看看这个问题:

解决方案是创建一条惰性路由:

{ path: 'Lazy', loadChildren: './+lazy/lazy.module#LazyModule' }
然后您可以使用
www.asdf.com/Lazy/Page30
www.asdf.com/Lazy/Page31
,url的第一段(
Lazy
)将丢失


是否有一些方法可以使用
www.asdf.com/Page30
www.asdf.com/Page31
使用相同的惰性模块进行惰性加载???

我知道有3种可能的解决方案(变通方法):

  • 使用单独的路由将懒惰模块分成两个懒惰模块-不同的URL通常意味着这些组件做不同的事情,并且应该在它们自己的模块中
  • 在这些组件之前添加一个前缀-而不是url/crisis admin和url/crisis user,您可以执行url/crisis/admin和url/crisis/user。(或者url/crisis/crisis admin,如果您觉得更好的话)
  • Route/to模块,这样您就可以在那里声明进一步的路由(您可能不想这样做)
  • 在带有页面的示例中,应按如下方式将其分开:

    url/page //base url
    ----url/page/30
    ----url/page/31
    
    或者更好:

    url/page?number=30
    url/page?number=31
    

    并将这些页面放入单个组件中(如果这对您是可行的)

    您可以使用如下路由器配置:

    const routes: any = [{
        path: "crisis-center",
        loadChildren: "crisis.module#CrisisModule"
    }, 
    { 
        path: "crisis-admin", 
        loadChildren: "crisis.module#CrisisModule"
    }];
    export const appRoutes: ModuleWithProviders = RouterModule.forRoot(routes, { useHash: false});
    
    在您的子路由器配置中(必须由您的
    危机中心
    模块导入):


    这只是一个漫长的尝试,我还没有尝试过。

    我也在尝试同样的事情,我已经找到了解决办法

    在app.module路由中,您可以执行以下操作

    {
    path: '',
    component: UserLayoutComponent,
    children: [
      {path: '', component: HomeComponent},
      {
        path: '',
        loadChildren:'app/user/user/user.module#UserModule'
      }
    ]
    }
    
    现在UserModule是延迟加载的

    在用户模块中,路由可以是这样的

    const routes: Routes = [
    { path: 'profile', component: ProfileComponent },
    { path: 'edit', component: EditProfileComponent} 
    ];
    
    同样,配置文件和编辑的工作方式如下: 本地主机:8080/profile和 本地主机:8080/编辑

    要检查模块是否确实是延迟加载,请在模块的构造函数中放入一些console.log()


    希望这有帮助,谢谢

    你说的“挂起”是什么意思?“在里面”,“挂起”不,这与“危机中心/危机中心”,“危机中心/危机管理”,“危机管理/危机管理”和“危机管理/危机中心”匹配感谢概念证明,似乎最好有一个通用模块,CrisCenter在本例中创建两个模块,一个用于管理员,另一个用于访问者,只需导入通用模块并使用所需的组件和服务即可。是的,但没有XD。在大型应用程序中,每个模块可能有多条路由。例如:仓库模块->发票、送货单、供应商、销售。。。CustomerModule->客户、公司、地址、评论。。。街道面板模块:国家、地区、城镇、邮政编码、街道。。。我希望有应用程序/供应商、应用程序/街道、应用程序/发票等路线。。。但是这个路由器强迫你拥有app/wh/invoice,app/cus/addresses,app/steetplan/contry。。。我越来越讨厌路由器了……是的,我知道那种痛苦。我必须承认,我也不喜欢它。但最好为该模块找到一个别致的名称,而不是等待在单个模块中下载8mb的应用程序。让我们看看angular团队将如何处理延迟加载和路由路径。是的,我知道,需要延迟加载。我是测试阶段的angular 2,我知道路由器2.0,你知道吗?我喜欢2.0胜过3.0。我不知道更改它的原因,可能是因为它是由Rob Eisemberg编写的,它将用于Aurelia项目。。。
    const routes: Routes = [
    { path: 'profile', component: ProfileComponent },
    { path: 'edit', component: EditProfileComponent} 
    ];