如下图所示,真实的DOM操作是由platform-browser.js完成的:parent.insertBefore, 这是HTML原生代码:

/*** Inserts a native node before another native node for a given parent using {@link Renderer3}.* This is a utility function that can be used when native nodes were determined - it abstracts an* actual renderer being used.*/
function nativeInsertBefore(renderer, parent, child, beforeNode) {ngDevMode && ngDevMode.rendererInsertBefore++;if (isProceduralRenderer(renderer)) {renderer.insertBefore(parent, child, beforeNode);}else {parent.insertBefore(child, beforeNode, true);}
}

Renderer同实际的操作平台的操作解耦:

更多Jerry的原创文章,尽在:“汪子熙”:

SAP Spartacus UnitDetailsComponent对应的UI插入,是在路由框架里完成的相关推荐

  1. 如何通过outlet在SAP Spartacus的产品明细页面插入自定义UI

    创建一个新的module: ng g m myOutlets 再基于该module创建一个Component,注意module的命名规范: 在生成的MyOutletsModule里,导入OutletR ...

  2. 关于 SAP Spartacus 电商云 UI feature level 的测试步骤

    Feature Level 在 app.module.ts 里维护: 测试步骤 注册一个新用户 并登录. 将产品添加到购物车. 转到购物车页面更新产品数量和结帐. 停止服务器 ./spartacus. ...

  3. SAP Spartacus UnitDetailsComponent的路由跟踪

    下图的createComponent方法,使用ComponentFactory创建ComponentRef: 在这个调用栈的createComponent方法里,componentFactory的fa ...

  4. SAP Spartacus 电商云 UI Shipping Method 在单元测试环境下没有显示的问题

    单元测试时,这一块区域没有渲染出来: supportedDeliveryModes$ 我之前已经确认了,deliveryModeLoaded$ 肯定为 true,所以只可能 supportedDeli ...

  5. 使用outlet在SAP Spartacus中添加自定义UI

    outlet 或者在SAP Spartacus中硬编码,或者通过CMS driven. Angular里添加自定义UI的原理是基于TemplateRef, 通过ng-template Componen ...

  6. SAP Spartacus Session affinity

    参见这个讨论. 后端运行在多个 pods/节点时,当子序列请求过早进入时,后端将无法跨集群发送缓存失效请求.此外,如果多个请求分散在多个节点上,则会消耗延迟和不必要的资源. 对于单个客户端,Spart ...

  7. SAP Spartacus 默认的 pwa,处于关闭状态还是打开状态?

    我 clone 了 SAP Spartacus 4.0版本,发现在 pwa.module-config.ts 里的 defaultPWSModuleConfig,pwd enabled 标志位处于 f ...

  8. SAP Spartacus SplitViewComponent Migration 的一个具体例子

    参考 Pull Request:https://github.com/SAP/spartacus/pull/9946/files 首先在 docs/migration/3.0_md 里添加文字描述: ...

  9. SAP Spartacus里product数据请求的HTTP url是在哪里维护的

    我们打开SAP Spartacus home页面时,能观察到product carousel里待显示的product数据从后台被请求: 随便点开一个url,格式如下: https://jerry.ea ...

最新文章

  1. 微软公布Win10正式版功能对比表,哪个版本适合你?
  2. 独家 | 最新NLP架构的直观解释:多任务学习– ERNIE 2.0(附链接)
  3. BER_TLV格式简介
  4. 基于linux服务器的性能分析与优化
  5. 是什么使你留在你现在的公司?
  6. 使用HtmlAgilityPack抓取网页数据
  7. IPFS的文件存储模式
  8. 英特尔预计5年内将成智能手机芯片大厂
  9. linux 系统改名,linux改名命令
  10. 【单调栈】最长不下降子序列变式
  11. Java开发必会Git分布式版本控制系统实战篇
  12. PCAN监测can总线状态设置
  13. 揭秘Apple Watch心率监测技术
  14. App上架安卓应用市场最全指南
  15. 裂变活动的5个关键步骤?
  16. IFD-x 微型红外成像仪探测距离说明
  17. Hibernate使用原生SQL查询
  18. 如何在服务器上快速克隆虚拟机,制作虚拟机模板快速克隆Linux虚拟机
  19. WindTerm:新一代开源免费的终端工具,GitHub星标6.6k+,太酷了
  20. 服务器配置防火墙的地址伪装和端口转发实例

热门文章

  1. 课后作业之字符串加密
  2. NUMA架构的CPU -- 你真的用好了么?
  3. 消息通信库ZeroMQ 4.0.4安装指南
  4. 前端开发学习笔记(一)深入浅出Javascript
  5. mysql主从双向同步复制
  6. Delphi数据类型
  7. 15 FFT及其框图实现
  8. spring-boot的spring-cache中的扩展redis缓存的ttl和key名
  9. 在VCS仿真器中使用FSDB
  10. 04_数据库升级onUpgradeondowngrade