How to associate a formula with a store in Sencha ExtJs v6?

Question

Here is the configuration for the formula:

formulas: { //this binding with the store did not work :( countDeactivatedVehicles: { bind: { bindTo: "{organizationCars}", deep: true, }, get: function (store) { return store.query("isCarActive", false).getCount(); } } } 

(currently, the count that we want is displayed only once, initially it means that it works fine when loading)

When the models inside the storeCars organization update the attribute, the binding does not work, the store does not report that its models have been updated.

What ideally should happen when the model is updated, the event is distributed in the store, so the store knows what has changed. This way the binding will work (?), And the formula will be calculated.

Answer 1

I do not think that this is really possible with the help of formulas, but you can use events.

Listening to load datachanged and update events, you can receive notifications of any changes in the store, from here you can do what you do in the formula and manually set it in ViewModel.

This script shows the best solution: https://fiddle.sencha.com/#view/editor&fiddle/1qvf

Score

 Ext.define('Fiddle.Store', { extend: 'Ext.data.Store', alias: 'store.test', listeners: { load: 'storeUpdate', update: 'storeUpdate', datachanged: 'storeUpdate' }, fields: [{ name: 'include', type: 'bool' }] }); 

ViewModel

 Ext.define('Fiddle.StoreBinderViewModel', { extend: 'Ext.app.ViewModel', alias: 'viewmodel.storebinder', stores: { teststore: { type: 'test' } }, data: { includedTotal: 0 } }); 

Controller

 Ext.define('Fiddle.StoreBinderController', { extend: 'Ext.app.ViewController', alias: 'controller.storebinder', storeUpdate: function (store) { var recs = store.query('include', true); this.getViewModel().set('includedTotal', recs.length) } });