[ExtJS] XTemplate -_-;;;

아래 두 소스의 차이점은 무엇일까요...

<br/> var tpl = new Ext.XTemplate( <br/> "<tpl for='.'>",<br/> "<div class='items-wrap'>",<br/> "<span class='icon-delete' wo:type='{type}' wo:id='{id}' ext:qtip='Delete' style='float:left;'></span>",<br/> "<span class='x-editable'>&nbsp;{name}</span></div>",<br/> "</tpl>", <br/> "<div class='x-clear'></div>"<br/>);<br/>

<br/> var tpl = new Ext.XTemplate( <br/> '<tpl for=".">',<br/> '<div class="items-wrap">',<br/> '<span class="icon-delete" wo:type="{type}" wo:id="{id}" ext:qtip="Delete" style="float:left;"></span>',<br/> '<span class="x-editable">&nbsp;{name}</span></div>',<br/> '</tpl>', <br/> '<div class="x-clear"></div>'<br/>);<br/>

아래의 store 로 template 를 dataview 에 붙여서 확인해보았습니다.

<br/> var store = new Ext.data.ArrayStore({<br/> autoDestroy: true,<br/> storeId: 'myStore',<br/> fields: [<br/> 'type',<br/> 'id',<br/> 'name'<br/> ]<br/>});<br/><br/>var myData = [<br/> ['A', 'Fred Flintstone', 'Fred'],<br/> ['B', 'Barney Rubble', 'Barney']<br/>]; <br/>store.loadData(myData);<br/>



첫번째 결과

두번째 결과

자바스크립트에서 문자열을 만들 때, 작은 따옴표냐 큰 따옴표냐의 차이가 첫번째이며,

그 안에 또 따옴표를 쓸 때의 차이가 있을 뿐이였습니다.


즉, 첫번째는 큰 따옴표 속에 작은 따옴표가 들어가 있는 것이며

두번째는 작은 따옴표 속에 큰 따옴표가 있는 것입니다.


일반적으로 자바에서라면 첫번째 방법으로 해야 하는 것이 옳습니다.

하지만 자바스크립트에서는 두번째 방법도 지원을 하는 것 같습니다.


다만 XTemplate 에서는 두번째 방법으로 해야지 정상적인 결과를 볼 수 있다는 점이....

저를 5시간 동안 삽질하게 만들어 주네요 -_ㅜ...