UI5 { } 이게 뭔지 모른다면? Property Binding 첫걸음 #shorts #SAP #UI5

Moderator · 2026. 5. 4.

Property Binding이란?

유아이파이브에서 중괄호 { }는 Model의 데이터를 View 속성에 연결하는 선언입니다. XML View에서 value="{/price}"라고 쓰면 JSONModel의 /price 값이 자동으로 표시됩니다.

기본 구조

// JSONModel 생성
var oModel = new JSONModel({
  price: 1000,
  name: "BTP Course"
});
this.getView().setModel(oModel);

XML View에서 바인딩

<!-- /price → value에 자동 표시 -->
<Input value="{/price}" />
<Text text="{/name}" />

<!-- 중첩 경로 -->
<Text text="{/user/email}" />

Named Model 바인딩

// "product" 이름 모델 등록
this.getView().setModel(oModel, "product");

<!-- XML에서 모델명 prefix -->
<Text text="{product>/name}" />
<Text text="{product>/price}" />

포맷터 적용

<Text text="{
  path: /price,
  formatter: .formatCurrency
}" />

핵심 한 줄

{ } = Model 경로 선언 — XML에 쓰면 데이터가 자동으로 View에 표시된다.