SAP Cloud for Customer Rule Editor的使用方法和底層工作原理
In C4C it is very convenient to define rule to dynamically control the visibility of a given UI element. This blog mainly focus on how it works under the hood, so that in case you meet with trouble or this dynamical mechanism does not work as you expected, you can first do trouble shooting by yourself before creating a ticket to SAP. For example I would like to enable FEED facet only in condition that the Priority equals to Immediate,
and hide it for any other values:
In order to achieve this we can simply create one rule as below, which means the visibility of FEED tab equals to the value of expression “Root.PriorityCode” evaluated in the runtime.
When this rule is created, the rule detail is stored as a CalculationRule node in UI Model. You can find it by appending “debugMode=true” in url.
Inside this CalculationRule node there is one important sub node:
<InvalidationTrigger id="e45bc0e9dd7ea57fff7cf29238564aad" bindingExpression="/Root/PriorityCode">
With this setting, whenever I change the UI element bound to Model field /Root/PriorityCode, the rule will be evaluated.
The rule represented in String format will be parsed into an Abstract Syntax Tree:
And its value gets evaluated:
The visibility of FEED tab is called as “DynamicProperty” as it is controlled dynamically by the rule I specified. The update on the visibility property will lead to the fact that the whole NavigationBar with internal ID ___bar1 is added to the invalidation queue whose elements will be invalidated later.
The Navigation bar gets rerendered in line 623:
The Navigation bar has its dedicated renderer NavigationBarRenderer which does the actual rendering work ( see my blog for detail about UI5 control render)
This is the reason why finally you could not see FEED tab in UI as the corresponding DOM element is not rendered by NavigationBarRenderer due to the IF evaluation in line 78.
要獲取更多Jerry的原創文章,請關注公眾號"汪子熙":
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/24475491/viewspace-2715433/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- SAP Cloud for Customer Account和individual customer的區別Cloud
- Spring Cloud底層原理SpringCloud
- SAP Cloud for Customer的Container應用設計原理CloudAI
- SAP Cloud for Customer的前世今生Cloud
- SAP Analytics Cloud和Cloud for Customer之間的Single Sign on配置Cloud
- SAP Cloud for Customer裡BusinessPartner, Customer和Employee這些BO的區別Cloud
- 深度剖析Spring Cloud底層原理SpringCloud
- Spring Cloud底層原理(核心元件)SpringCloud元件
- SAP Cloud for Customer裡新的Lead UI對Mashup整合的支援原理CloudUI
- 如何把SAP Kyma和SAP Cloud for Customer連線起來Cloud
- SAP Cloud for Customer和SAP Fiori系統裡的OData測試工具Cloud
- SAP Cloud for Customer Work Center(工作中心)的實現原始碼Cloud原始碼
- JUnit 註解@Rule的工作原理
- SAP Cloud for Customer裡Sales Order和Sales Quote的建模方式Cloud
- SAP Commerce Cloud 新一代 UI Spartacus 和 Customer Data cloud 的整合CloudUI
- runtime的底層原理和使用
- SAP Cloud for Customer的Mashup位於CustomPane裡Cloud
- 如何使用SAP Cloud for Customer裡的Data SourceCloud
- SAP CRM和Cloud for Customer中的Event handler(事件處理器)Cloud事件
- SAP CRM,Cloud for Customer和Fiori應用的direct navigation比較CloudNavigation
- SAP Cloud for Customer Extensibility的設計與實現Cloud
- SAP Cloud for Customer ABSL的一些優化Cloud優化
- SAP Cloud for Customer的CTI呼叫中心解決方案Cloud
- 使用soapUI消費SAP Cloud for Customer的web serviceUICloudWeb
- SAP Cloud for Customer框架是如何使用JavaScript Promise的Cloud框架JavaScriptPromise
- SAP CRM和Cloud for Customer裡的Formatted Text控制元件的比較CloudORM控制元件
- SAP 電商雲 Spartacus UI 同 SAP Customer Data Cloud 的整合UICloud
- SAP Cloud for Customer的Account Team裡的role如何配置Cloud
- KVO的使用和底層實現原理
- flutter底層原理和embedder的隱憂Flutter
- SAP CRM和Cloud for Customer的擴充套件欄位後設資料Cloud套件
- SAP Cloud for Customer Price-計價簡介Cloud
- SAP Cloud for Customer 標準培訓課程Cloud
- 使用nodejs消費SAP Cloud for Customer上的Web serviceNodeJSCloudWeb
- Netty的底層原理Netty
- Volatile的底層原理
- HashMap的底層原理HashMap
- 如何將Twitter訊息匯入到SAP CRM和Cloud for Customer去Cloud