ExtJS 4如何从另一个控制器/视图创建和显示新的控制器/视图？

Question

我已经看了看很多的ExtJS 4 MVC的例子,他们都几乎表现出同样的东西:应用程序创建一个视口,负载在视图中,并有一个"控制器"定义,它init的控制器:

Ext.application({
    name: 'AM',

    controllers: [
        'Users'
    ],

    launch: function() {
        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            items: [
                {
                    xtype: 'userlist'
                }
            ]
        });
    }
});

多数民众赞成,但现在让我们说在我的应用程序中我希望我的视图中包含一个按钮来打开一个全新的控制器/视图,你是如何做到的？

我认为我正在寻找的是一种方式: - 创建控制器(运行它的初始化代码) - 在控制器初始化代码中,创建视图并显示它

这是对的,你怎么做的？

我想澄清一下,在我的情况下,我需要SAME控制器/视图组合的两个单独实例.例如,我可能有一个带有选项卡面板和两个选项卡的视图.然后,我想在每个选项卡中放置两个"用户"控制器和"user.List"视图的单独实例.

Answer 1

我认为我正在寻找的是一种方式: - 创建控制器(运行它的初始化代码) - 在控制器初始化代码中,创建视图并显示它

在extjs中,所有控制器在加载应用程序时都会实例化.您可以使用类中的启动方法Application来启动视图.并让控制器听取该视图的事件.在控制器中,您始终可以使用application对象访问其他控制器:

 this.application.getController('ControllerName1').displayListPanel(options);

在上面的代码中,我调用了displayListPanelControllerName1控制器中可用的方法.此方法保存代码以在屏幕上显示视图(网格面板).同样,我可以使用创建视图的方法,例如用于数据输入的新表单.这是另一个例子:

this.application.getController('ControllerName1').newDateForm();

在我的方法中:

newDataForm : function() {

        var view = Ext.widget('form',{title: 'New Data'});
        view.show();
    },

Answer 2

刚刚检查了新控制器和视图类的文档。

在我看来，当你需要的时候，你总能找到所需的视图。例如，您可以：

//somewhere in controller
this.getView('Viewport').create(); // or .show()

检查这个并查看类方法：

http://docs.sencha.com/ext-js/4-0/#!/api/Ext.app.Controller-method-getView