SAP Spartacus的ProductAdapter和OccProductAdapter

2020-09-17 14:12:24 853 收藏
分类专栏： Spartacus标准开发
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/i042416/article/details/108641523
版权

路径：C:\Code\SPA\spartacus\projects\core\src\occ\adapters\product\occ-product.adapter.ts

通过这种机制，将SAP Spartacus加载的product同Commerce Cloud后台解耦。比如，我们可以实现一个ERPProductAdapter，然后用Angular的依赖注入，替换掉从Commerce Cloud后台取product主数据的OccProductAdapter：


汪子熙 CSDN认证博客专家 前端框架 Node.js SAP
JerryWang，2007年从电子科技大学计算机专业硕士毕业后加入SAP成都研究院工作至今。Jerry是SAP社区导师，SAP中国技术大使。2020年5月下旬，Jerry做了脑部肿瘤的开颅切除手术，对编程和人生又有了新的感悟。
已标记关键词 清除标记
使用Angular依赖注入自定义SAP Spartacus的ProductAdapter
SAP资深技术专家Jerry Wang的分享
09-17 851
新建一个MyProductAdapter，继承自SAP Spartacus的ProductAdapter，返回一些fake数据： import { Injectable } from '@angular/core'; import { Product, ProductAdapter, ScopedProductData } from '@spartacus/core'; import { Observable, of } from 'rxjs'; const PRODUCT = { code: '30
表情包
插入表情
还能输入1000个字符
SAP Spartacus Visible Focus
SAP资深技术专家Jerry Wang的分享
12-18 40
https://sap.github.io/spartacus-docs/visible-focus/ In Spartacus, focusable elements are styled with a blue outline. This appearance can be further customized in the CSS layer if you prefer to have an alternative effect for certain elements. 默认是蓝色边框，可以定制
SAP Spartacus简介
SAP资深技术专家Jerry Wang的分享
10-31 117
终于写到Jerry目前正在做的开发任务了。 2015年的时候，那时Jerry已经做了一年多的SAP UI5开发，想进一步精进自己的开发技能，就申请了一个位于德国Walldorf总部的UI5 Extensibility开发的Fellowship Program，为期6个月。Jerry发了简历给接收Fellowship的团队老板，很快收到回复，团队老板对我的简历很感兴趣，但是表示这个Program没有Relocation Budget，如果我过去，在Walldorf的住宿得我自己掏钱解决。因为这不是商务出差，因
如何自定义SAP Spartacus店铺的界面颜色风格
SAP资深技术专家Jerry Wang的分享
09-01 605
SAP Spartacus电商页面默认的颜色风格： 注意下图红色高亮部分的颜色风格： 在项目文件夹的style.scss里，添加如下代码片段： :root { --cx-color-primary: blue; --cx-color-secondary: green; } 更改之后的颜色效果： 以这个蓝色的购物车为例， 其css background属性的值来自变量–cx-color-primary, 后者定义在文件_mini-cart.scss里： searchbox的
SAP Spartacus支持的语言和货币单位的数据源
SAP资深技术专家Jerry Wang的分享
08-31 194
打开SAP Spartacus Storefront，看到可以在四中语言和两种货币之间切换： 这些下拉菜单里的语言和货币，是Spartacus向Commerce Cloud发起的Restful API请求获得的： 商品的图片，最终通过platform-browser.js以属性的方式设置： 要获取更多Jerry的原创文章，请关注公众号"汪子熙": ...
SAP Spartacus的产品主数据模型
SAP资深技术专家Jerry Wang的分享
09-11 836
位置：C:\Code\SPA\mystore\node_modules@spartacus\core\src\occ\occ-models\occ.models.d.ts 位于命名空间occ内： 通过interface Product定义产品数据模型： 第二处Product定义： 路径：C:\Code\SPA\mystore\node_modules@spartacus\core\src\model\product.model.d.ts 要获取更多Jerry的原创文章，请关注公众号"汪子熙": .
SAP Commerce Accelerator和SAP Spartacus的技术对比
SAP资深技术专家Jerry Wang的分享
11-21 64
Accelerator是Spartacus发布之前，SAP Commerce Cloud使用的Storefront实现。Accelerator是一个开箱即用的web实现模板，是Commerce平台的一部分，以源代码的方式交付给客户。客户通过一个叫做module generator的工具，基于Accelerator 模板代码生成自己的Storefront实现。Accelerator这种同Commerce平台的紧耦合关系，以及基于源代码级别的二次开发方式，给Commerce项目实施的可升级性带来很大的挑战。例如
SAP Spartacus pageSlot一览
SAP资深技术专家Jerry Wang的分享
10-07 322
在page-slot.component.html里增添一个h1标签： 最后渲染出来的效果： 在page-slot.component.html里增添如下测试代码： <h4>Jerry: {{position}}</h4> <div *ngIf="components[0]"> <h5>Component uid: {{ components[0].uid }}</h5> <h6>Type code: {{ components[
SAP Spartacus和Table相关的配置结构ResponsiveTableConfiguration
SAP资深技术专家Jerry Wang的分享
01-27 22
ResponsiveTableConfiguration的父类是TableStructureConfiguration： export interface TableStructureConfiguration { /** * Provide the bare structure of the table. */ cells?: string[]; /** * Global table structure options. */ options?: TableOp
SAP Spartacus 3.0和B2B特性相关的手动测试
SAP资深技术专家Jerry Wang的分享
11-30 35
Admin tasks: sign in as admin create a unit edit a unit create a sub unit create a buyer and assign to a unit edit the buyer create a cost center create a budget assign a budget to a cost center add an address to a unit add another address delete first on
SAP Spartacus的页面类型和路由配置
SAP资深技术专家Jerry Wang的分享
01-21 26
The CMS in SAP Commerce Cloud comes with the concept of three special page types: Product Page, Category Page, Catalog Page (Catalog is not supported for now) and one common type Content Page used for all other pages, i.e. login, order history or faq. Cata
SAP Spartacus ProductConnector和ProductService实现
SAP资深技术专家Jerry Wang的分享
09-22 484
名称：ProductConnector 路径：在core文件夹下 通过ProductAdapter向Commerce Cloud发起数据请求： 逻辑很简单，直接调用adapter的load方法。 什么时候ProductConnector会被调用？ let ProductEffects = class ProductEffects { constructor(actions$, productConnector) { this.actions$ = actions$;
SAP Spartacus和传统的Accelerator超时机制的区别
SAP资深技术专家Jerry Wang的分享
02-19 18
Spartacus works differently than Accelerator. In the Accelerator, the session expires after a determined idle time. The counter is reset each time the user triggers a request. In Spartacus, the “access_token” has a fixed time to live which does not depend
SAP Hybris Accelerator和SAP Spartacus的比较
SAP资深技术专家Jerry Wang的分享
06-17 148
# Created by Wang, Jerry, last modified on Jun 07, 2016 ![clipboard1](https://user-images.githubusercontent.com/5669954/36073443-a0a97202-0f6b-11e8-9883-e27546756613.png) ![clipboard2](https://user-...
SAP Spartacus language和currency Component data加载
SAP资深技术专家Jerry Wang的分享
09-22 473
ComponentWrapperDirective： 首先给components字典分配一个uid entry： 如果pageContext为undefined，进入this.createComponentData, 首先生成pageContext： 发现一个规律，每个Component data加载都是先pageContext为undefined，第二次就被正确填充了： 要获取更多Jerry的原创文章，请关注公众号"汪子熙": ...
SAP Spartacus里px，em和rem的应用
SAP资深技术专家Jerry Wang的分享
02-25 23
px px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。 任意浏览器的默认字体高都是16px. em em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。 em的值并不是固定的； em会继承父级元素的字体大小。 rem 使用rem为元素设定字体大小时，仍然是相对大小，但相对的只是HTML根元素。rem可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以
SAP Spartacus里和focus相关的directive之间的继承关系
SAP资深技术专家Jerry Wang的分享
12-11 90
selector：cxFocus FocusDirective -> LockFocusDirective -> TrapFocusDirective -> TabFocusDirective -> AutoFocusDirective TrapFocus继承TabFocus： LockFocus继承TrapFocus： Focus继承LockFocus： 传入focusdirective的配置结构：FocusConfig： [cxFocus]=“focusConfig”,
SAP Spartacus cx-table的fosuable和firstFocusable属性
SAP资深技术专家Jerry Wang的分享
12-11 35
这两个属性在lock-focus里能查看到： 这a.hide-focus-border： 指向的元素是表格里第一行的Unit code字段，有一个超链接，点击后会路由到unit detail页面： 第二个focusable元素：button.tree-item-toggle， 指向的是下图这个togger按钮： 更多Jerry的原创文章，尽在：“汪子熙”: ...
SAP Commerce SmartEdit如何同SAP Spartacus协同工作
SAP资深技术专家Jerry Wang的分享
12-16 41
将Commerce Cloud里下列文件拷贝到Angular应用的src文件夹里： hybris/bin/modules/smartedit/smarteditaddon/acceleratoraddon/web/webroot/_ui/shared/common/js/webApplicationInjector.js 编辑Angular项目的angular.json, 把SmartEdit的webApplicationInjector.js添加进去： "architect": { "build": {
Jerry在2020 SAP全球技术大会的分享：SAP Spartacus技术介绍的文字版
SAP资深技术专家Jerry Wang的分享
12-16 71
这是Jerry 2020年的第86篇文章，也是汪子熙公众号总共第268篇原创文章。 这篇文章的视频版本如下： https://v.qq.com/x/page/b3212l6kqvg.html 这个分享是SAP 2020全球技术大会(SAP TechEd)，“客户自主”时代的极致体验分论坛内容之一： 本文的分享主要分为以下四个方面来介绍Spartacus. 首先，通过Spartacus四大特性的介绍，让大家对作为SAP Commerce Cloud新一代Storefront这个电商前台店铺应用有一个直观的了
©️2020 CSDN 皮肤主题: 博客之星2020 设计师:CY__ 返回首页