Data Binding Tutorial - 10 Property Formatting Using Data Types
📌 개요
SAPUI5는 Boolean, Currency, Date 그리고 Float과 같은 data type을 제공한다. 이러한 data types을 control에 적용하여 화면에 표시된 값의 형식이 올바르게 지정되었는지 확인하고 필드가 입력용으로 열려 있는 경우 사용자가 입력한 값이 해당 데이터 유형의 요구 사항을 준수하는지 확인할 수 있다. 이제 Currency type의 'Sales Amount' 필드를 추가해보자.
📌 예제
- MainView.controller.js
const oModel = new JSONModel({
firstName: "Harry",
lastName: "Hawk",
enabled: true,
address: {
street: "Dietmar-Hopp-Allee 16",
city: "Walldorf",
zip: "69190",
country: "Germany"
},
salesAmount: 12345.6789,
currencyCode: "EUR"
});
- MainView.view.xml
<l:VerticalLayout>
<Label labelFor="salesAmount" text="{i18n>salesAmount}:"/>
<Input description="{/currencyCode}" enabled="{/enabled}" id="salesAmount"
value="{
parts: [
{path: '/salesAmount'},
{path: '/currencyCode'}
],
type: 'sap.ui.model.type.Currency',
formatOptions: {showMeasure: false}
}" width="200px"/>
</l:VerticalLayout>
'salesAmount' Model property에 대해 새로운 Label 및 Input element 쌍이 생성되었다. Input elemenet의 description property는 'currencyCode' model property가 binding되었다.
Input element의 value property는 model property salesAmount와 currencyCode에 binding되었다.
{showMeasure: false}
parameter는 input 필드 자체에서 currency symbol을 이끈다. Input element의 description property를 사용하여 표시되기 때문에 필요하지 않다.
- i18n.properties
salesAmount=Sales Amount
- manifest.json
아래의 코드를manifest.json
에 추가하면 유효성 검사 메시지가 데이터가 변경될 때 자동으로 생성된다. 바인딩된 property에 할당된 type(위의 코드에서는 type이sap.ui.model.type.Currency
)이 있는 경우 유효성 검사에서 메시지 생성을 트리거할 수 있다.
"sap.ui5": {
...
"handleValidation": true,
...
}
따라서 Currency
type이 아닌 경우의 type의 data를 입력했을 때 다음과 같은 화면을 볼 수 있다.
🔗 참고
- SAPUI5 SDK Property Formatting Using Data Types
- SAPUI5 Formatting, Parsing, Validating Data
- SAPUI5 Validataion Messages
- github example
Author And Source
이 문제에 관하여(Data Binding Tutorial - 10 Property Formatting Using Data Types), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@hjh0017/Data-Binding-Tutorial-10-Property-Formatting-Using-Data-Types저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)