1

I am use extjs 6.5.3 modern toolkit and a am puzzled by the following question: how to bind listeners from viewModel to view?

example fiddle: https://fiddle.sencha.com/#view/editor&fiddle/30en

code:

Ext.application({
    name: 'Fiddle',

    launch: function () {
        let container1 = Ext.create("Ext.panel.Panel", {
            width: 640,
            height: 480,
            html: 'hello world!',

            viewModel: {
                data: {
                    // not works
                    listeners: {
                        onPlay: function () {
                             Ext.Msg.alert('onPlay', 'onPlay!');
                        }
                    },
                    title: 'test'
                }
            },

            // works
            //listeners: {
            //    onPlay: function () {
            //        Ext.Msg.alert('onPlay', 'onPlay!');
            //    }
            //},

            bind: {
                listeners: '{listeners}',
                title: '{title}'
            },

            controller: {
                init: function () {
                    this.getView().fireEvent('onPlay', this.getView());
                }
            }
        });

        Ext.Viewport.add({
            xtype: 'container',
            padding: 10,
            items: [container1]
        });
    }
});
lampa
  • 161
  • 1
  • 12

1 Answers1

2

Your code correctly binds the onPlay listener but does not work because the binding happens after your controller initialized. If you fire the onPlay event later e.g. using a timer, the alert will be shown. Check https://fiddle.sencha.com/#view/editor&fiddle/30et

Jonas Osburg
  • 1,733
  • 1
  • 14
  • 17
  • Maybe there is an event that fires after the initial bind? – lampa Oct 23 '19 at 20:53
  • Sure, initViewModel should be fine: initViewModel - Called when the view’s ViewModel is created (if one is defined). https://docs.sencha.com/extjs/7.0.0/guides/application_architecture/view_controllers.html#application_architecture-_-view_controllers_-_life_cycle – Jonas Osburg Oct 24 '19 at 15:32