使用“class”属性绑定控件

Answer 1

UI5 不支持在 XML 视图中直接

绑定 

class，因为它不是 ManagedObject

 的有效属性。但是，有一个解决方法：添加 

自定义数据：

1. 将

   CustomData

    和属性 

   writeToDom 添加到您的控件中。在那里使用你的表达式绑定：

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

   根据表达式绑定的结果，

   data-green

    将添加到控件的 HTML 元素中。然后浏览器可以操作与 

   属性选择器相对应的颜色。

2. 因此，您的 CSS 应包含相应的选择器：
   .myApp .sapControlXYZ.myControl[data-green] { /* ... */ }

这是一个

示例：https://embed.plnkr.co/LAv1qfsUjX0Anu7S/

当然，您也可以在

value="{...}"

 中定义绑定，以增加 CSS 特异性。

.myApp .sapControlXYZ.myControl[data-green="someBoundValue"] { /* ... */ }要了解有关如何在 DOM 中利用自定义数据的更多信息，请查看文档主题

将数据作为 DATA-* 属性写入 HTML DOM。

---

⚠️ 在使用自定义 CSS 之前..

可能有些控件不需要自定义 CSS。例如：

• 带有语义或行业特定颜色的文本：sap.m.ObjectStatus

  、

  .ObjectNumber

  等

• 自定义格式的文本：sap.m.FormattedText

  。

SAP 明确警告不要使用自定义 CSS 样式。

OpenUI5 生成的 HTML 和

CSS 不是公共 API 的一部分，可能会在补丁和次要版本中发生更改。如果您决定覆盖样式，则需要在每次更新 OpenUI5 时测试并更新您的修改。 [...] 因此，SAP Fiori launchpad 应用程序不应覆盖样式。

一般来说，应始终质疑添加自定义 CSS 样式的重要性，并与利益相关者进行仔细检查，以提高 Fiori 应用程序之间的 UI 一致性并降低总体 TCO。

Answer 2

Boghyon Hoffmann 的回答非常棒！

但是，如果他的选项都不适合您，您可以随时使用

Text

 元素的两个不同副本以及 

visible

 属性（支持表达式绑定）：

<Text
  class="greenTextColor"
  text="{HintTable>IS_ENABLED}"
  visible="{= ${HintTable>IS_ENABLED === 'TRUE'} }"
/>
<Text
  class="redTextColor"
  text="{HintTable>IS_ENABLED}"
  visible="{= ${HintTable>IS_ENABLED !== 'TRUE'} }"
/>

提示： 如果您的模型包含，请简化您的表达式 布尔值而不是字符串：

visible="{= ${HintTable>IS_ENABLED} }" 和

visible="{= !${HintTable>IS_ENABLED} }"

Answer 3

如果您使用本地
1. JSONModel

    作为 HintTable，并且 

   IS_ENABLED

    属性位于模型的根级别，则必须使用斜杠 

   "HintTable>/IS_ENABLED"

    访问它。
   尝试一下。 

我不确定是否可以绑定类属性。没试过。