запуск приложения широкие события

как заставить контроллеры говорить друг с другом ...

в дополнение к очень большому ответу выше я хочу упомянуть события широкого применения, которые могут быть очень полезны в настройке MVC для обеспечения связи между контроллерами. (extjs4.1)

допустим, у нас есть станция контроллера (примеры Sencha MVC) с полем выбора:

Ext.define('Pandora.controller.Station', {
    extend: 'Ext.app.Controller',
    ...

    init: function() {
        this.control({
            'stationslist': {
                selectionchange: this.onStationSelect
            },
            ...
        });
    },

    ...

    onStationSelect: function(selModel, selection) {
        this.application.fireEvent('stationstart', selection[0]);
    },    
   ...
});

когда поле выбора запускает событие изменения, функция onStationSelect уволен.

в этой функции мы видим:

this.application.fireEvent('stationstart', selection[0]);

это создает и запускает широкое событие приложения, которое мы можем слушать с любого другого контроллера.

таким образом, в другом контроллере мы теперь можем знать, когда поле выбора станции было изменено. Это делается через прослушивание this.application.on следующим образом:

Ext.define('Pandora.controller.Song', {
    extend: 'Ext.app.Controller', 
    ...
    init: function() {
        this.control({
            'recentlyplayedscroller': {
                selectionchange: this.onSongSelect
            }
        });

        // Listen for an application wide event
        this.application.on({
            stationstart: this.onStationStart, 
                scope: this
        });
    },
    ....
    onStationStart: function(station) {
        console.info('I called to inform you that the Station controller select box just has been changed');
        console.info('Now what do you want to do next?');
    },
}

если поле выбора было изменено, мы теперь запускаем функцию onStationStart в контроллере Song также ...

из документов Сенча:

события приложения чрезвычайно полезны для событий, которые имеют много контроллеров. Вместо того чтобы прослушивать одно и то же событие представления в каждом из этих контроллеров, только один контроллер прослушивает событие представления и запускает событие всего приложения, которое могут прослушивать другие. Это также позволяет контроллерам общаться друг с другом, не зная или в зависимости от друг друга существование.

в моем случае: щелчок по узлу дерева для обновления данных в панели сетки.

обновление 2016 благодаря @gm2008 из комментариев ниже:

что касается запуска пользовательских событий в масштабах всего приложения, теперь есть новый метод после ExtJS V5. 1 публикуется, который использует Ext.GlobalEvents.

когда вы запускаете события, вы можете позвонить:Ext.GlobalEvents.fireEvent('custom_event');

когда вы регистрируете обработчик события, вы звоните: Ext.GlobalEvents.on('custom_event', function(arguments){/* handler codes*/}, scope);

этот метод не ограничивается контроллеров. Любой компонент может обрабатывать пользовательское событие, помещая объект компонента в область входных параметров.

найдено в Sencha Docs: MVC Part 2

еще один трюк для прослушивателей событий контроллера.

вы можете использовать подстановочные знаки для наблюдения за событием из любого компонента:

this.control({
   '*':{ 
       myCustomEvent: this.doSomething
   }
});

просто хотел добавить пару пенсов к отличным ответам выше: Если вы работаете над pre Extjs 4.1, и у вас нет широких событий приложения, но они нужны, я использую очень простой метод, который может помочь: Создайте простой объект, расширяющий наблюдаемое, и определите любые события приложения, которые могут вам понадобиться в нем. Затем вы можете запускать эти события из любого места вашего приложения, включая фактический элемент html dom и прослушивать их из любого компонента, передавая необходимые элементы из эта компонента.

Ext.define('Lib.MessageBus', {
    extend: 'Ext.util.Observable',

    constructor: function() {
        this.addEvents(
            /*
             * describe the event
             */
                  "eventname"

            );
        this.callParent(arguments);
    }
});

тогда вы можете, из любого другого компонента:

 this.relayEvents(MesageBus, ['event1', 'event2'])

и уволить их из любого компонента или элемента DOM:

 MessageBus.fireEvent('event1', somearg);

 <input type="button onclick="MessageBus.fireEvent('event2', 'somearg')">

просто еще две вещи, которые я нашел полезными, чтобы знать, даже если они не являются частью вопроса, на самом деле.

можно использовать relayEvents метод, позволяющий компоненту прослушивать определенные события другого компонента, а затем запускать их снова, как если бы они исходили из первого компонента. В документах API приведен пример сетки, ретранслирующей хранилище load событие. Это очень удобно при написании пользовательских компонентов, которые включают несколько компонентов.

в другую сторону вокруг, т. е. передача событий, полученных инкапсулирующим компонентом mycmp к одному из его субкомпонентов subcmp, можно сделать такой

mycmp.on('show' function (mycmp, eOpts)
{
   mycmp.subcmp.fireEvent('show', mycmp.subcmp, eOpts);
});