Bind ViewModel Data and store to Grid Template

[hitman01]

I'm using Ext.grid.Panel in conjunction with ViewModel. In ViewModel I have defined a store which is bound to store in the grid.

However, in addition to store, I also have data in the ViewModel which I would like to reference in the grid template.


How can I bind data and store in the ViewModel to grid data and reference both in the Template?

[hitman01]

One way I was thinking of accomplishing this is by injecting the additional data into each store record but I'm hoping there might be a better way of doing this.

[sebastian.dimap]

One way I was thinking of accomplishing this is by injecting the additional data into each store record but I'm hoping there might be a better way of doing this.

Hi,

i think its not inteded that you use other data then what the records includes in a template.

tpl: [
                '{name} {[this.getExtraData()]}',
                {
                    getExtraData: function () {
                        const data = this.owner.grid.getController().getViewModel().getData();
                        // do your work
                    },
                }
            ]

[hitman01]

This would be perfect answer, except that this.owner is undefined!

Any other way to achieve this?

[sebastian.dimap]

this schould work.

{
    xtype: 'templatecolumn',
    defaultRenderer: function(value, meta, record) {
        const myData = this.ownerCt.grid.lookupController().getViewModel().getData();
        const data = Ext.apply(myData, record.data, record.getAssociatedData());
        return this.tpl.apply(data);
    },
    tpl: '....'
},

[sebastian.dimap]

you can also use this.ownerCt.grid.lookupViewModel().getData();