하이브리드 앱 센차터치2.0 - XTemplate 화면구성

1. 개요

 

XTemplate는 복잡하고 반복적인 데이터 구조를 이용해서 화면 UI를 구성할 때 주로 많이 사용된다. XTemplate의 특징은 자체 연사작와 조건 처리 기능을 가지고 있다는 것이다.

 

템플릿에 반복문을 처리하기 위한 데이터를 지정하기 위해서는 JSON배열에게 key값을 부여해 주어야 한다.

 

 

2. 구성

 

- JSON 데이터

var someData = {

array_key: [

{sub_key1: "value1", sub_key2: "value2"},

{sub_key1: "value1", sub_key2: "value2"}

]

};

 

- 사용 예제

var stpl = new Ext.XTemplate(

"<tpl for='.'>", // root 노드 부터 접근

// for문 시작

"<tpl for='array_key'>",

"<div>{sub_key1} - {sub_key2}</div>",

"</tpl>",

// for문 끝

"</tpl>"

);