angular:已加载通配符路由，而不是热切加载的模块中的路由 [英] angular : wildcard route loaded instead of route in eagerly loaded modules

问题描述

我有一个包含2个功能模块的应用程序:1个是延迟加载的，1个是紧急加载的.

I have an app with 2 feature modules: 1 is lazy loaded and 1 is eagerly loaded.

在我的应用程序路由中，我想添加一个"**"未找到页面"的通配符路由场景.

In my app routing, I want to add a "**" wildcard route for the "page not found" scenario.

const routes: Routes = [
  { path: '', loadChildren: () => import('./landing-page/landing-page.module').then(m => m.LandingPageModule) },
  { path: '**', redirectTo: '', pathMatch: 'full' }
];

这与延迟加载的模块配合正常.

This was working fine with the lazy loaded module.

现在，我已经添加了热切加载的模块和它自己的路由模块.因此，我的应用程序路由"以上保持不变.我只是将渴望加载的模块导入我的应用程序模块中.这是我热切加载的模块的路由配置:

Now I've added the eagerly loaded module with it's own routing module. So my "app routing" above remains the same. I just import the eagerly loaded module in my app module. This is the routing config of my eagerly loaded module:

const routes: Routes = [
  { 
    path:"people", 
    children: [
      { path: "invite", component: InviteComponent}
    ]}
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class PeopleRoutingModule { }

我的问题是

• 当我在应用程序路由中保留通配符路由时，永远不会到达人员/邀请路由.
• 当我删除通配符路由时，可以联系到人员/邀请.

所以我该如何添加找不到页面"?场景?

推荐答案

我找到了比以前更好的解决方案...

I found a solution which is much better than my previous one...

在app.module中，确保将路由模块放在急切加载的模块后面！

In app.module, make sure you put the routing module behind the eagerly loaded module!

 imports: [
    BrowserModule,
    SharedModule,
    PeopleModule, /* Eagerly loaded module with routing*/
    UsersModule,
    BrowserAnimationsModule,
    AppRoutingModule /* Make sure the app routing module is imported after the eagerly loaded module!! */
 ]

这篇关于angular:已加载通配符路由，而不是热切加载的模块中的路由的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！