带有独立控制器的 ExtJS4 模块化？

Question

我正在尝试将 ExtJS4 应用程序拆分为模块。

 - app
  - store
  - controller
  - model
  - view
  - module
     - m1
         - model
         - view
         - controller
     - m2
         - model
         - ...

问题是，当我启动应用程序并初始化其中一个 m1 控制器时，该控制器没有 this.control() 函数。

-- 编辑--

我在控制器文件夹中定义了一个类。

Ext.define( 'App.module.ping.controller.Ping', {
  extend: 'Ext.app.Controller',

  requires: [
     'App.module.ping.view.PingPanel'
  ],

  init: function() {
     this.control( {
        '#app.module.ping': {
           render: this.onPanelRendered
        }
     } );
  },

  onPanelRendered: function() {
     ...
  }

});

稍后我会打电话

Ext.create('App.module.ping.controller.Ping').init();

但我收到此错误：

Uncaught TypeError: Cannot call method 'control' of undefined
Ext.define.control./lib/extjs-4.1.0/src/app/Controller.js:414
Ext.define.init./app/module/ping/app/controller/Ping.js:11
Ext.define.init./app/module/ping/app/Module.js:11
(anonymous function)app.js:17
(anonymous function)app.js:35

Module.js 是带有 create() 调用的文件 Ping.js 是带有 define() 调用的文件

-- 编辑2--

病理例子：

输入：

Ext.define( 'MyController', { 
  extend: 'Ext.app.Controller', 
  init: function() { console.log('initialized'); } 
});

输出：

function constructor() {
  return this.constructor.apply(this, arguments);
}

输入：

Ext.create('MyController');

输出：

constructor

输入：

MyController.create();

输出：

constructor

-- 编辑3--

控制器在创建时需要配置对象中的应用程序对象。应用程序对象将自己添加到所有控制器中，这些控制器不是使用 create 手动创建的。它调用这样的东西：

Ext.create('App.controller.Users', { application: this, ... } );

稍后它使用应用程序对象将控制调用重定向到它。

control: function ( config ) { this.application.control( config ) };

所以我可能会实现一些机制，在创建这些控制器时自动将应用程序添加到这些控制器中。

Answer 1

你试过了吗

var pingController = Application.getController('App.module.ping.controller.Ping');
pingController.init(); //or pingController.init(Application);

其中 Application 是对 Ext.application.launch 期间创建的对象的引用 - 例如

var Application = {};
Ext.application({
    //all of your settings,
    launch:function(){
         Application = this;
         //other launch code
    }
}
});

Answer 2

致所有来这里寻找解决方案的人：

Uncaught TypeError: Cannot call method 'control' of undefined

抛开一整天的挫败感，上面的答案并没有解决我的问题，但引导我尝试以下方法，确实解决了问题：

// app.js
Ext.application({
    ...

    launch: function(){
        var me = this;
        ...

        me.getController('ControllerName');
    }
});

// inside controller/ControllerName.js
init: function(app){
    var me = this;

    app.control({
        '#editButton': {
            click: function(){
                me.someFunction();
            }
        }
    });
},

该应用程序变量与为问题选择的答案中的“var Application = {}”相同——这意味着我不需要全局添加它（或根本不需要）。我一定尝试过一百万种不同的东西，但这终于奏效了。希望它能拯救别人。

Answer 3

不需要手动调用init()。只要调用Ext.create，就会自动调用构造函数。