javascript - ExtJSテンプレートマークアップ(XTemplate)で角括弧をエスケープしますか?

Question

私は ExtJS 4 を使用しており、XTemplate マークアップ内で一連の角括弧を使用する必要があります。この必要性は、レンダリングされた出力で角括弧を保持する必要があるという事実から生じます。より具体的には、名前にダッシュ (マイナス記号) を含むオブジェクト プロパティを扱っています。JavaScript でこれらのプロパティの値にアクセスするには、角かっこを使用する必要があります。

raw.cmsInstances[\'cms-thumb\'].url

JavaScript で CSS を扱ったことのある人なら誰でも、CSS プロパティ名のダッシュでこの問題に遭遇したことがあります。

同じ結果を達成する代替構文 (角括弧表記) を見つけることができませんでした。

ExtJS カスタム オブジェクト タイプを使用して、この制限を回避しました。具体的には、次の手法を使用して、ExtDirect の生の入力にアクセスし、そこから値をテンプレート マークアップにプッシュしています。

Ext.define('my.ux.file.IconBrowser', {
    tpl: [
        '<tpl for=".">',
            //Am trying to use this notation, due to dash in property name:
            //'<img src="{raw.cmsInstances[\'cms-thumb\'].url}"/>'
            //But this causes XTemplate to evaluate whatever is between the square
            //brackets.

            (!Ext.isIE6? '<img src="{raw.cmsInstances.cmsThumb.url}"/>' : 
            '<div style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'{raw.cmsInstances.cmsThumb.url}\')"></div>'),
        '</tpl>'
    ],
    initComponent: function() {
        Ext.data.Types.RAW = {
            convert: function(v, data) {
                return data.raw;
            },
            type: 'Raw'
        };
        var types = Ext.data.Types;
        this.store = Ext.create('Ext.data.Store', {
            proxy: {
                type: 'direct',
                directFn: this.loadLibraryApi,
                paramOrder: ['instanceType'],
                reader: {
                    root: 'data'
                }
            },
            fields: [
                {name: 'raw', type: types.RAW}
            ]
        });

        this.callParent(arguments);
    }
});

角かっこをエスケープするか、同じ結果を達成する代わりの方法を見つけたいと思います。

前もって感謝します！