Angular11启动时从接口加载的路由已注册却无法访问匹配报错

• 路由更新时机晚于初始导航触发
  Angular 11默认会在应用启动阶段提前触发初始导航，如果你的动态路由添加逻辑没有阻塞初始导航，导航执行时动态路由还未生效，后续再修改router.config也不会重新触发已完成的导航规则更新。
  解决方法需要在路由模块配置中关闭自动初始导航：

@NgModule({
  imports: [RouterModule.forRoot(routes, {
    initialNavigation: 'disabled' // 关闭自动初始导航
  })]
})

等动态路由全部添加完成后，手动调用router.initialNavigation()触发初始导航。

• 直接修改router.config未调用更新方法
  仅修改router.config数组内容不会让Router实例内部的路由匹配树更新，必须调用router.resetConfig()方法传入合并后的全量路由配置，新路由才会被路由识别器感知：

// 错误写法
router.config.push(...dynamicRoutes)
// 正确写法
router.resetConfig([...router.config, ...dynamicRoutes])

• 通配符路由优先级高于动态路由
  如果你的根路由配置里预先写了**通配符路由用于匹配404页面，且该路由配置在动态路由添加之前，通配符会优先匹配所有未在初始配置里的路径，导致动态路由永远不会被命中。需要将通配符路由的添加逻辑放到动态路由全部添加完成之后，再一起传入resetConfig方法。
• 动态路由的加载配置错误
  如果动态路由中配置的懒加载模块路径错误、组件未正确导入到对应模块，Angular路由解析时会抛出隐藏的加载错误，外层提示会被统一包装为路由不匹配的报错。可以在路由配置中开启enableTracing配置调试路由匹配过程，定位具体是解析失败还是匹配失败。

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