SAP 电商云 Spartacus UI 产品明细页面路由确定后，加载的是 page template
页面如下：
http://localhost:4200/powertools-spa/en/USD/jerryproduct/3881018/Angle%20Grinder%20RT-AG%20115
template id 为：ProductDetailsPageTemplate
在 product detail page module 里，我们调用 RouterModule.forChild, 指定路由匹配后，加载的 Component 为 PageLayoutComponent:
我在这个 Component 的 html 文件里，增添一条 div 语句作为打印输出：
运行时效果：
这个 ProductDetailsPageTemplate 出现在 router-outlet 指令下面，显然是通过路由加载的：
在 layout config 配置文件里，可以将其 slots 删除一部分做一个测试：
比如只剩 Summary slot：
效果如下：
更多Jerry的原创文章，尽在：“汪子熙”:
SAP 电商云 Spartacus UI 产品明细页面路由确定后，加载的是 page template相关推荐
- SAP 电商云 Spartacus UI 产品明细页面路由路径的自定义配置
如下图所示,为了减少 SAP 电商云 Spartacus 客户实施时不必要的配置,Spartacus 将不少页面的路由路径的默认配置,定义在如下的 default-routing-config.ts ...
- 如何找到 SAP 电商云 Spartacus UI 产品明细界面对应的 Angular 实现 Component 名称
我们看一个 PDP 即 product detail page 的实际例子: http://localhost:4200/powertools-spa/en/USD/product/3881017/a ...
- SAP 电商云 Spartacus UI product 明细页面的路由配置
如果直接访问如下 url: http://localhost:4200/powertools-spa/en/USD/jerryproduct/3881018/Angle%20Grinder%20RT- ...
- SAP 电商云 Spartacus UI 产品搜索结果的设计明细
我们使用如下 url 访问 SAP 电商云 Spartacus UI 产品搜索页面: http://localhost:4000/electronics-spa/en/USD/search/sony ...
- SAP 电商云 Spartacus UI Quick Order 的路由和 CMS 实现
如下图高亮区域所示: root config 包含了敲击多少个字符后,触发 product 搜索的配置: import { Injectable } from '@angular/core'; imp ...
- SAP 电商云 Spartacus UI 去除 Checkout 页面 header 和 footer 区域的几种方法介绍
1 distraction-free checkout 如何移除 checkout 页面的 footer 和 header 方法1 - 把 checkout CMS page 的header 和 fo ...
- SAP 电商云 Spartacus UI delivery mode 页面设计的结构分析
deveop 分支: 总的来说分为两个模板,分别对应非 4.2.2 和 4.2.2 版本. 我们细看 4.2.2 版本,这个版本只有一个 spinner: 解决双 spinner 问题: checko ...
- Mobile first 设计思路在 SAP 电商云 Spartacus UI 中的设计体现一例
关于 Mobile First 的概念,请查看我这篇文章:什么是前端开发中的 mobile first 策略. 下图是 SAP 电商云 Spartacus UI 的搜索结果页面: 其布局设计:temp ...
- SAP 电商云 Spartacus UI ComponentDataProvider defer 工厂函数
为什么 this.componentService.getItems 最后就触发到 Component-data.provider.ts 工厂函数的执行了? 29行的 getService: getS ...
最新文章
- javascript中apply、call和bind的区别
- D2 第11届前端技术论坛记录
- php文件管理器工具,八年PHP文件管理器
- linux如何制作服务,linux把jar做成服务
- javascript数据结构与算法---队列
- 使用tensorflow object detection API 训练自己的目标检测模型 （二）labelImg的安装配置过程
- eclipse 下编写java code 比较好的设置和快捷键
- Oracle等待事件之Enqueue（锁）
- 服务器内存 知乎_巨炮快评！ 篇六：16核32线程384GB内存！双路Intel至强数据服务器拆解...
- 搭建php程序之Linux 安装PHP集成环境宝塔面板
- 银行利率bps是什么意思,贷款利率bps是什么意思
- javafx 教程_集成JavaFX和Swing（修订版）
- 李航·《统计学习方法》学习笔记
- excel学习笔记(一)
- 深入浅出React和Redux-程墨
- 每秒处理10万高并发订单的乐视集团支付系统架构分享【转】
- golang元转分、分转元
- Android--获取所有联系人以及所有的字段(联系人头像,邮箱,地址,公司等)
- js 格式化prettier配置_prettier 格式化插件
- Spring学习(九）