Ext_app_Controller.t

The Ext.app.Application for this controller.

Registers one or more references.

Parameters:

refs: _ Js.t

Adds listeners to components selected via Ext.ComponentQuery. Accepts an object containing component paths mapped to a hash of listener functions.

In the following example the updateUser function is mapped to to the click event on a button component, which is a child of the useredit component.

 Ext.define('AM.controller.Users', {
     init: function() {
         this.control({
             'useredit button[action=save]': {
                 click: this.updateUser
             }
         });
     },

     updateUser: function(button) {
         console.log('clicked the Save button');
     }
 });

Or alternatively one call control with two arguments:

 this.control('useredit button[action=save]', {
     click: this.updateUser
 });

See Ext.ComponentQuery for more information on component selectors.

Parameters:

selectors: _ Js.t
If a String, the second argument is used as the listeners, otherwise an object of selectors -> listeners is assumed
listeners: _ Js.t (optional)
Config for listeners.

Returns the base Ext.app.Application for this controller.

Returns:

Ext_app_Application.t Js.t
the application

Returns instance of a Controller with the given id. When controller doesn't exist yet, it's created. Note that this method depends on Application instance and will return undefined when Application is not accessible. The only exception is when this Controller instance's id is requested; in that case we always return the instance even if Application is no available.

Parameters:

id: Js.js_string Js.t

Returns:

Ext_app_Controller.t Js.t
controller instance or undefined.

Returns a Model class with the given name. A shorthand for using Ext.ModelManager.getModel.

Parameters:

name: Js.js_string Js.t

Returns:

Ext_data_Model.t Js.t
a model class.

Returns instance of a Store with the given name. When store doesn't exist yet, it's created.

Parameters:

name: Js.js_string Js.t

Returns:

Ext_data_Store.t Js.t
a store instance.

Returns a View class with the given name. To create an instance of the view, you can use it like it's used by Application to create the Viewport:

this.getView('Viewport').create();

Parameters:

name: Js.js_string Js.t

Returns:

#Ext_Base.t Js.t
a view class.

Returns true if a reference is registered.

Parameters:

_ref: _ Js.t

A template method that is called when your application boots. It is called before the Application's launch function is executed so gives a hook point to run any code before your Viewport is created.

Parameters:

application: Ext_app_Application.t Js.t

Adds listeners to different event sources (also called "event domains"). The primary event domain is that of components, but there are also other event domains: Global domain that intercepts events fired from Ext.globalEvents Observable instance, Controller domain can be used to listen to events fired by other Controllers, Store domain gives access to Store events, and Direct domain can be used with Ext.Direct Providers to listen to their events.

To listen to "bar" events fired by a controller with id="foo":

 Ext.define('AM.controller.Users', {
     init: function() {
         this.listen({
             controller: {
                 '#foo': {
                    bar: this.onFooBar
                 }
             }
         });
     },
     ...
 });

To listen to "bar" events fired by any controller, and "baz" events fired by Store with storeId="baz":

 Ext.define('AM.controller.Users', {
     init: function() {
         this.listen({
             controller: {
                 '*': {
                    bar: this.onAnyControllerBar
                 }
             },
             store: {
                 '#baz': {
                     baz: this.onStoreBaz
                 }
             }
         });
     },
     ...
 });

To listen to "idle" events fired by Ext.globalEvents when other event processing is complete and Ext JS is about to return control to the browser:

 Ext.define('AM.controller.Users', {
     init: function() {
         this.listen({
             global: {               // Global events are always fired
                 idle: this.onIdle   // from the same object, so there
             }                       // are no selectors
         });
     }
 });

As this relates to components, the following example:

 Ext.define('AM.controller.Users', {
     init: function() {
         this.listen({
             component: {
                 'useredit button[action=save]': {
                    click: this.updateUser
                 }
             }
         });
     },
     ...
 });

Is equivalent to:

 Ext.define('AM.controller.Users', {
     init: function() {
         this.control({
             'useredit button[action=save]': {
                click: this.updateUser
             }
         });
     },
     ...
 });

Of course, these can all be combined in a single call and used instead of control, like so:

 Ext.define('AM.controller.Users', {
     init: function() {
         this.listen({
             global: {
                 idle: this.onIdle
             },
             controller: {
                 '*': {
                    foobar: this.onAnyFooBar
                 },
                 '#foo': {
                    bar: this.onFooBar
                 }
             },
             component: {
                 'useredit button[action=save]': {
                    click: this.updateUser
                 }
             },
             store: {
                 '#qux': {
                     load: this.onQuxLoad
                 }
             }
         });
     },
     ...
 });

Parameters:

to: _ Js.t
Config object containing domains, selectors and listeners.

A template method like init, but called after the viewport is created. This is called after the launch method of Application is executed.

Parameters:

application: Ext_app_Application.t Js.t

Class type Ext_app_Controller.t