How to call VIEW functions within a XTemplate (itemTpl)

Question

There are a couple of questions about this that works, but don't in my scenario. I want to invoke a function defined in my superclass view, instead of invoking a function in the itemTpl itself.
I´ve something like this in the itemTpl:

'<span class="x-button-label" style="" id="ext-element-115">{[this.getTranslation("textcodestr", "Text by default")]}</span>',

And then, I've this function in the itemTpl config.

                getTranslation: function (textCode, defaultText) {
                    var store = Ext.getStore('TranslationsStore');
                    var index = store.findExact('TextCode', textCode)
                    if (index > -1) {
                        return store.getAt(index).data.TextTranslated;
                    }
                    return defaultText;
                }

It works, but I want to move this function to the superclass of the view, and be able to invoke the function within the template, instead of copy and paste in all the application templates.
Of course that use a hyper-long line that do what is in the function is not ideal.

Is there a way to do this ?

Thanks!
Milton

Answer 1

I managed to solve it by using a singleton helper, which I can invoke from the itemTpl.

Ext.define('MyApp.util.Shared', {
singleton : true,

getTranslation: function (textCode, defaultText) {
     var store = Ext.getStore('TranslationsStore');
     var index = store.findExact('TextCode', textCode)
     if (index > -1) {
          return store.getAt(index).data.TextTranslated;
     }
     return defaultText;
}});

Then, in the itemTpl

'<span class="x-button-label" style="" id="ext-element-115">{[MyApp.util.Shared.getTranslation("textcodestr", "Text by default")]}</span>',

HTH!
Milton.