如何根据布尔值动态地将颜色应用于SAP.m文本控件？

使用“class”属性绑定控件 - 使用自定义数据的解决方法

此问题解决了将颜色动态应用于中的值的挑战基于布尔值的 SAP.m 文本控件。虽然以下 XML 代码看起来符合逻辑，但它无法更改控件的类：

<code class="xml"><Text
  class="{= ${HintTable>IS_ENABLED} === 'TRUE' ? 'greenTextColor' : redTextColor'}"
  text="{HintTable>IS_ENABLED}"
/></code>

UI5 不允许在 XML 视图中直接进行类绑定。但是，存在使用自定义数据的解决方法：

1. 使用 writeToDom 集添加自定义数据：
   在控件中包含自定义数据元素：

   <code class="xml"><ControlXYZ class="myControl">
     <customData>
       <core:CustomData xmlns:core="sap.ui.core"
         writeToDom="{= expression }"
         key="green"
         value=""
       />
     </customData>
   </ControlXYZ></code>

2. 定义 CSS 选择器：
   在 CSS 中添加相应的选择器：

   <code class="css">.myApp .sapControlXYZ.myControl[data-green] { /* ... */ }</code>

这将添加根据 writeToDom 中的表达式绑定，将 data-green 添加到控件的 HTML 元素。然后浏览器可以相应地更改颜色。

示例：

<code class="xml"><Text
  class="myControl"
  text="{value}"
>
  <customData>
    <core:CustomData xmlns:core="sap.ui.core"
      writeToDom="{= ${value} === 'TRUE' }"
      key="green"
      value=""
    />
  </customData>
</Text></code>

<code class="css">.myApp .sapText.myControl[data-green] { color: green; }
.myApp .sapText.myControl:not([data-green]) { color: red; }</code>

注意：

SAP建议不要使用自定义 CSS，尤其是对于具有预定义颜色或格式的控件。自定义样式可能会影响应用程序的一致性并增加维护工作量。在修改样式之前咨询利益相关者。

以上是如何根据布尔值动态地将颜色应用于SAP.m文本控件？的详细内容。更多信息请关注PHP中文网其他相关文章！