ngRouterOutlet与组件生命周期：自定义模板渲染异常问题

问题详情 #

• 开发了基于Angular Material的共享表格组件，支持根据数据和列配置渲染表格：
  • 为字符串、数字类型提供默认模板
  • 允许用户为任意列自定义模板
• 搭建了包含3个路由的示例应用：Home、Page1（含表格）、Page2（含表格）
• 异常现象：导航至表格页面时，首次加载无法完整渲染表格，需再次导航至同一页面才能正常显示
• 推测原因：生命周期时序问题，首次渲染时模板缺失，导致抛出ExpressionChangedAfterItHasBeenCheckedError错误

需求目标 #

实现表格首次加载即可完整渲染，且无上述错误抛出

疑问 #

抛出ExpressionChangedAfterItHasBeenCheckedError错误后，生产环境下该问题是否会自行解决？

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