SAP 电商云 Spartacus UI shipping method 切换时的 spinner 显示
- component 里增加一个新成员属性:setModePressed, 默认为 false
在 changeMode 函数执行时,将该属性设置为 true:
然后,在对应的 effect 成功调用了 HTTP put 方法之后,将该 boolean 值重新设置为 false.
我们通过捕捉 DeliveryModeEvent, 来获知何时 Delivery Mode 成功被设置。
constructor(private fb: FormBuilder,private checkoutDeliveryService: CheckoutDeliveryFacade,private checkoutConfigService: CheckoutConfigService,private activatedRoute: ActivatedRoute,private events: EventService,private ref: ChangeDetectorRef,protected checkoutStepService: CheckoutStepService,) {const result$ = this.events.get(DeliveryModeEvent);result$.subscribe((event) =>{console.log('Jerry set delivery mode finished: ',event);this.setModePressed = false;this.ref.markForCheck();});}
我们通过下列代码,将 DeliveryModeEvent 同 Ngrx action CheckoutActions.SET_DELIVERY_MODE_SUCCESS 绑定在一起。这样一来,一旦有 Ngrx action 发生,我们就能扑捉到它绑定的 DeliveryModeEvent.
更多Jerry的原创文章,尽在:“汪子熙”:
SAP 电商云 Spartacus UI shipping method 切换时的 spinner 显示相关推荐
- SAP 电商云 Spartacus UI 出现 breaking change 时,如何用文字来描述
用文字描述 html 文件的变化: In attribute cxPopoverOptions of element button.hint-popover property displayClose ...
- SAP 电商云 Spartacus UI 产品搜索结果的设计明细
我们使用如下 url 访问 SAP 电商云 Spartacus UI 产品搜索页面: http://localhost:4000/electronics-spa/en/USD/search/sony ...
- 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 ...
- SAP 电商云 Spartacus UI 里如何捕捉语言设置的更改
我们知道在 SAP 电商云 Spartacus UI 里,用户可以通过下拉菜单更改当前访问 site 的语言: 监控语言变化的代码: this.subscription.add(this.langua ...
- 在 SAP 电商云 Spartacus UI 里手动注入 module 的几种排列组合
先把所有的排列组合罗列如下: (1) 通过构造函数注入 QuickOrderFacade,但不调用其方法 (2) 通过构造函数注入 QuickOrderFacade,调用其方法 (3) 手动通过 in ...
- SAP 电商云 Spartacus UI Proxy Facade 的一个实际例子
如何理解 SAP 电商云 Spartacus UI 中的 proxy facade? Jerry 这篇文章什么是 SAP 电商云 Spartacus UI 的 proxy façade提供了理论上的解 ...
- SAP 电商云 Spartacus UI Quick Order 主页的实现
存货单位(英語:stock keeping unit,SKU/ˌɛsˌkeɪˈjuː/),也翻译为库存单元,是一個會計學名詞,定义为库存管理中的最小可用单元,例如纺织品中一个SKU通常表示规格.颜色. ...
- SAP 电商云 Spartacus UI 从 CMS 取回 slots 和 component 之后的处理
从前一篇文章SAP 电商云 Spartacus UI 的双重 layout 配置层设计 我们得知,Spartacus 层面的 layout-config.ts 可以控制 page template 应 ...
最新文章
- linux下批量发请求
- Java8 forEach
- 计算机网络-子网划分举例
- 网络:XSS和HttpOnly
- 【计算摄影】计算机如何学会欣赏照片的美感?
- 收官礼 |《神策 2018 数据驱动大会回顾专刊》发布,你要的干货,已打包!
- Linux MTD系统剖析
- 怎么使图表居中显示_【Excel技巧】制作柱形图图表完美呈现百分比,提升您的报表颜值...
- redchat怎么编写shell脚本_如何写shell脚本?尝试自己编写一个简单脚本
- python文件读取模式_day-2 python 文件读写模式r,r+,w,w+,a,a+的区别
- 基于 Docker Compose 实践 .NET Core 的现代化架构 2:在容器中集成 Skywalking APM
- python字典类型写入文件_python 字典写入文件
- 【zz】matlab 直方图匹配
- 59. 螺旋矩阵 ||
- 使用SQL的全文搜索功能构建 Web 搜索应用程序
- atitit 项目管理 持续集成 构建管理CI jenkins.docx
- Sql server 2008 R2设置定期清理数据库日志文件
- 如何写H5/web前端工程简历中的项目经验
- vue项目获取浏览器地址栏参数方法 ?aaa=111bbb=222(非路由传参)
- CentOS7 或 Ubuntu20.04、22.04 安装最新版 Podman-4.1.1,离线安装请移步到连接