Adding variable value to class in sensha touch

Question

For styling purposes, I need a class to have a variable value as part of the class name

config: {
    cls: 'section cart-item {variable}',
    items: [{
        layout: 'hbox',
        items: [{
            name: 'image',
            cls: 'left',
            flex: 4,
            tpl: [
                '<div style="min-height: 10em"><img src="{thumbnail}" width=100 /></div>
            ].join('')
        }
...

This doesn't seem to work. I've read adding a variable to cls isn't supported.

There is too much going on following to try and use a tpl approach. Is there a way to break up a div around everything or add an id or something else?

Answer 1

Suppose you have a view and you want to assign class dynamically, here it goes like this

Ext.define('someview.namespace',{
    config: {
        cls: 'section cart-item',
        // here all other code
    },
    initialize: function(){
       this.callParent();
       var cls = 'abc'; // here get your class dynamically.
       this.addCls(cls);
    }
});