부울 값을 기반으로 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의 표현식 바인딩을 기반으로 컨트롤의 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!