SAP Spartacus B2B 頁面 Disable 按鈕的顯示原理

時間 2021-05-10

標籤 html 工具 spa code component htm rem input 欄目 HTML 简体版

原文原文鏈接

SAP Spartacus B2B 頁面 disable 按鈕以下圖所示。html

這個高亮的 disable 按鈕，和左邊相鄰的 Edit 按鈕，實現位於不一樣的 Component. 工具

disable 按鈕有單獨的實現 Component：toggle-status.component.ts, selector: cx-org-toggle-statusui

在 B2B Launchpad 6 個 tile 裏都消費了該 Component，以 unit 頁面爲例，消費代碼以下：spa

<cx-org-toggle-status
    actions
    key="uid"
    i18nRoot="orgUnit"
  ></cx-org-toggle-status>

其中 18 行的 key，19 行的 i18nRoot, 都是爲了給該 Component 的 @input 屬性傳遞輸入值：code

而 17 行的屬性 actions，咱們試着把這個值改一改，看會發生什麼：component

不出所料，Disable 按鈕從工具欄裏消失了：htm

根據關鍵字 select="[actions]" 搜索，能發現 card.component.html 模板實現裏，經過 ng-content 實現了動態內容注入，注入條件是那些包含了 actions 屬性的標籤。rem

因此，包含了 Disable 按鈕的 Component，其屬性值必須是 actions，只有這樣，才能被動態注入到 card.component.html 的 header 區域去。input

更多Jerry的原創文章，盡在："汪子熙":
it

相關標籤/搜索