Ionic 4嵌套路由不生效：访问items/address无法加载子路由模块

我来帮你排查下这个路由跳转的问题，从你的配置和常见的Angular/Ionic路由坑点入手：

1. 父组件必须有<router-outlet> #

你的ItemsPage作为父路由的承载组件，必须在它的模板（items.page.html）里添加<router-outlet></router-outlet>标签。子路由address的内容要靠这个标签来渲染，如果没有它，路由系统找不到子组件的挂载点，就很可能自动回退到父路由页面。

2. 升级懒加载路由的语法试试 #

如果你的Angular版本是8及以上，旧的字符串拼接#的懒加载写法可能存在兼容性问题，换成官方推荐的动态导入语法：

const routes: Routes = [ 
  { path: '', component: ItemsPage, children :[ 
    { path: 'address', loadChildren: () => import('../address/address.module').then(m => m.AddressPageModule) }, 
  ] }, 
];

这种写法能更稳定地解析懒加载模块的路径，避免路径解析错误导致的跳转异常。

3. 检查ItemsPage内部的跳转逻辑 #

看看items.page.ts里有没有自动导航的代码，比如在ngOnInit里写了this.router.navigate(['/items'])，或者有没有路由守卫（比如canActivate、canDeactivate）强制把页面重定向回items。这些内部逻辑会直接覆盖路由配置的行为。

4. 确认AddressModule的路由配置 #

要保证AddressPageModule里的路由是匹配空路径的，因为它是作为子路由懒加载进来的：

// address.module.ts里的路由配置
const routes: Routes = [
  { path: '', component: AddressPage }
];

这样当访问items/address时，懒加载的模块才能正确匹配到AddressPage组件。

内容的提问来源于stack exchange，提问作者pratik jaiswal