SAP Spartacus User form通过label标签的实现原理

简介: SAP Spartacus User form通过label标签的实现原理

第一次见到这个有点诧异,居然是通过label实现的:image.png上述页面可以从SAP Spartacus User list,点击某个user进入明细页面开始编辑:image.png看到这个ng-reflect-name=roles, 就知道其template里,有一个[name]=XXX的绑定设计:

image.pngdesign time:

image.png

runtime:

image.png注意design time的appendTo=“cx-org-list”, 翻译成了runtime的: ng-reflect-append-to='cx-org-list".


原来user role form页面采取了分块设计的思路,UI visual part分成不同的块,每一块由一个label标签页实现:



image.png然而design time里并没有runtime源代码里的ng-reflect-name属性。

image.pngimage.png

相关文章
|
存储 对象存储
Spartacus 添加 PWA 应用到 home 的实现原理分析
Spartacus 添加 PWA 应用到 home 的实现原理分析
|
前端开发 API uml
SAP Commerce Cloud 里的 User 模型和 Restriction 的关系
SAP Commerce Cloud 里的 User 模型和 Restriction 的关系
|
6月前
|
存储 缓存 数据管理
Spartacus cart list item 删除的实现原理
Spartacus cart list item 删除的实现原理
|
6月前
|
搜索推荐
关于 SAP ABAP 系统的 User parameter COM_IOITF_DEBUG
关于 SAP ABAP 系统的 User parameter COM_IOITF_DEBUG
|
监控 安全 搜索推荐
关于 SAP Commerce Cloud 本地安装用 root user 执行安装脚本的问题
关于 SAP Commerce Cloud 本地安装用 root user 执行安装脚本的问题
|
存储 数据处理 数据库
关于 SAP CRM User Status 处理的示例 ABAP 代码
关于 SAP CRM User Status 处理的示例 ABAP 代码
|
XML JSON 前端开发
用 SmartEdit 打开 SAP Commerce Cloud Storefront 时动态在 body 标签注入的 css class
用 SmartEdit 打开 SAP Commerce Cloud Storefront 时动态在 body 标签注入的 css class
|
开发者
SAP UI5 应用开发教程之四十四 - Label 和 Input 控件文本没有水平对齐的原因分析和解决方案
SAP UI5 应用开发教程之四十四 - Label 和 Input 控件文本没有水平对齐的原因分析和解决方案
|
Web App开发 XML 前端开发
SAP UI5 应用开发教程之三十六 - 使用 Chrome 开发者工具 Elements 标签动态修改 CSS 类试读版
SAP UI5 应用开发教程之三十六 - 使用 Chrome 开发者工具 Elements 标签动态修改 CSS 类试读版
|
前端开发
SAP UI5 SimpleForm M 和 L 型表单的 label 和 input 分配讲解
SAP UI5 SimpleForm M 和 L 型表单的 label 和 input 分配讲解