我的应用程序的 RouterModule 不是延迟加载帖子

My app's RouterModule isn't lazy loading posts

我正在学习 Angular 作为练习项目,我正在为一个 API 服务的 Wordpress API 开发一个 front-end 界面(angular 13) =47=]容器。

angular 应用程序必须显示从 API 获得的所有 post 的列表,并通过使用路由,一旦单击 post,在 /post/:id:/:slug/ 中应该只显示请求的 post。

我的项目代码:https://www.temporary-url.com/3BD84

我最新的changes/commits,实现延迟加载:https://www.temporary-url.com/08C

应用看起来像这样:

这些是被调用内容的一些日志:

单击 post 时(例如标题为 Hello World 的那个),地址栏中的 url 正确更改为主机:port/post/1/hello-world 并调用以下内容:

路由器尝试按照定义的相同顺序匹配路由。由于您在 post 页面之前定义了通配符路由 **

const routes: Routes = [
  ...
  {
    path: '**',
    component: HomeComponent,
  },
  {
    path: 'post/:id/:slug',
    loadChildren: () => import('./post/post.module').then(m => m.PostModule),
  },
];

当您尝试访问 post url 时,路由器会将其与通配符路由匹配并创建新的 HomeComponent

要解决这个问题,您只需将通配符路由移动到数组的末尾即可。

干杯