SAP Spartacus B2B 页面 Disable 按钮的显示原理

简介: SAP Spartacus B2B 页面 Disable 按钮的显示原理

SAP Spartacus B2B 页面 disable 按钮如下图所示。


这个高亮的 disable 按钮,和左边相邻的 Edit 按钮,实现位于不同的 Component.


image.png


disable 按钮有单独的实现 Component:toggle-status.component.ts, selector: cx-org-toggle-status


image.png



在 B2B Launchpad 6 个 tile 里都消费了该 Component,以 unit 页面为例,消费代码如下:


image.png

image.png

其中 18 行的 key,19 行的 i18nRoot, 都是为了给该 Component 的 @input 属性传递输入值:


image.png


而 17 行的属性 actions,我们试着把这个值改一改,看会发生什么:


image.png


不出所料,Disable 按钮从工具栏里消失了:


image.png


根据关键字 select="[actions]" 搜索,能发现 card.component.html 模板实现里,通过 ng-content 实现了动态内容注入,注入条件是那些包含了 actions 属性的标签。


image.png


所以,包含了 Disable 按钮的 Component,其属性值必须是 actions,只有这样,才能被动态注入到 card.component.html 的 header 区域去。

image.png


相关文章
|
5月前
|
设计模式 API 数据处理
Spartacus 在 PDP 页面点击 Add to Cart 之后,读取最新 product 数据的设计
Spartacus 在 PDP 页面点击 Add to Cart 之后,读取最新 product 数据的设计
|
5月前
|
前端开发 JavaScript 安全
Spartacus product summary 页面的设计原理
Spartacus product summary 页面的设计原理
|
5月前
|
存储 供应链 调度
Spartacus 在 Back-Office 修改了产品的价格和描述信息后,修改会反应在 PDP 页面上吗
Spartacus 在 Back-Office 修改了产品的价格和描述信息后,修改会反应在 PDP 页面上吗
|
5月前
|
前端开发 搜索推荐 开发者
Spartacus empty cart 页面的显示逻辑
Spartacus empty cart 页面的显示逻辑
|
5月前
|
XML JavaScript 数据格式
SAP UI5 XML Preprocessor 的工作原理和 instructions 指令详解
SAP UI5 XML Preprocessor 的工作原理和 instructions 指令详解
SAP Fiori Elements 应用里图片字段(Image)的显示原理介绍试读版
SAP Fiori Elements 应用里图片字段(Image)的显示原理介绍试读版
|
缓存 负载均衡 前端开发
SAP Spartacus 和 Sticky session 相关的话题
SAP Spartacus 和 Sticky session 相关的话题
SAP Emarsys 和 SAP Spartacus 的集成
SAP Emarsys 和 SAP Spartacus 的集成
|
API 开发者
Google Tag Manager (GTM) 和 Adobe AEPL 在 SAP Spartacus 中的应用
Google Tag Manager (GTM) 和 Adobe AEPL 在 SAP Spartacus 中的应用
|
5月前
|
JSON 开发者 数据格式
关于 SAP Spartacus LandingPage2Template 区域的 layout 设计实现
关于 SAP Spartacus LandingPage2Template 区域的 layout 设计实现
下一篇
无影云桌面