天天看点

SAP Spartacus list view里router-outlet的填充逻辑

当我点击某个cost center的hyperlink后:

SAP Spartacus list view里router-outlet的填充逻辑

触发router.js里的activate方法:

SAP Spartacus list view里router-outlet的填充逻辑

在_activatedRoute里,能看到被激活,待显示的Component是AppComponent:

SAP Spartacus list view里router-outlet的填充逻辑

router.js里和创建被激活Component相关的代码:

SAP Spartacus list view里router-outlet的填充逻辑

Component factory:

SAP Spartacus list view里router-outlet的填充逻辑

Component创建成功之后,添加到router-outlet对应的container里:

SAP Spartacus list view里router-outlet的填充逻辑

insert操作调用nativeInsertBefore,最终调用DOM元素原生的insertBefore方法,将待显示的Component对应的selector,加入到router-outlet所在的container里去:

SAP Spartacus list view里router-outlet的填充逻辑
SAP Spartacus list view里router-outlet的填充逻辑

最后的效果:

SAP Spartacus list view里router-outlet的填充逻辑

继续阅读