ExtJS中Controller类的动态加载.

参考：http://stackoverflow.com/questions/7725911/dynamically-manage-ext-app-application-controllers

目录结构参考Ext经典目录，此处不在截图。

1，打开Ext的动态加载机制，在app.js首部加入如下代码：

Ext.Loader.setConfig({enabled: true});

2，确保已经定义Controller类，比如定义一个叫Menu的Controller。方法如下

$touch app/controller/Menu.js && vi app/controller/Menu.js

Menu.js:

Ext.define('Appname.controller.Menu', {
    extend: 'Ext.app.Controller',      // leave it as it is
    models: ['Event','User'],          // this assumes App.model.* prefix
    stores: ['Options','Permissions'], // this assumes App.store.* prefix
    views:  ['menu.Bar','SmartButton'],// this assumes App.view.* prefix
    requires: [
        'App.whatever.other.class',    // auto-load this class as a dependency
        'WidgetsLibrary.*',            // auto-load all classes in WidgetsLibrary
    ],

    init: function(){}

 // [...]

3. 动态加载。方法如下：

Ext.require(                   
    'App.controller.Menu',     // this auto-loads all dependencies 
    function(){ 
        // ... as soon as this class 
        //    and all its dependencies have loaded...
        var controller = Ext.create('App.controller.Menu');  // create an instance
        controller.init();                                   // launch init() method
    }
);

如果需要判断，是否已经加载Menu。可使用

if(Ext.ClassManager.isCreated('App.controller.Menu')){
    // ... controller has already been loaded and init ... 
}else{
    // we need to auto-load that controller using Ext.require()
}

更多内容：

api: http://docs.sencha.com/extjs/4.2.0/#!/api/Ext-method-require

程序结构： http://docs.sencha.com/extjs/4.2.0/#!/guide/application_architecture