javascript - ExtJS 4 - 从动画侦听器调用 javascript 类方法失败

Question

我有一个控制器在视图上运行一些动画。动画完成后，我需要goToMainApp在我的控制器上执行一个方法（称为 ）。我的动画完整侦听器被调用——那里没问题……但方法调用失败。这是控制器：

Ext.define('LoginApp.controller.LoginController', {
    extend : 'Ext.app.Controller',

    config : ....
    init : ......

    goToMainApp : function() {
        console.log('Redirecting to main application');
        do important stuff here....;
    },

    tryLogin : function() {
        this.getCredentialsForm().submit({
            success : function(form, action) {
                console.log('login successful');

                // fade out the login form element
                var form = Ext.ComponentQuery.query("loginview")[0];
                form.getEl().fadeOut({
                    duration : 500,

                        listeners : {
                            afteranimate : function() {
                                console.log('login successful');  // WORKS!!!
                                this.goToMainApp();  // FAILS!!!
                            }
                    }
                });

            },
            failure : .....
        });
    }
});

我认为我的问题是this我调用的this.goToMainApp();是动画对象而不是控制器......但我不知道如何修复它。

Answer 1

只需将范围添加到您的侦听器：

scope: this

来自文档的示例：

        tryLogin : function() {
        this.getCredentialsForm().submit({
            scope : this,    // Sets scope of the form handler to the controller
            success : function(form, action) {
                console.log('login successful');

                // fade out the login form element
                var form = Ext.ComponentQuery.query("loginview")[0];
                form.getEl().fadeOut({
                    duration : 500,

                        listeners : {
                            scope : this, // Now also sets it to controller
                            afteranimate : function() {
                                console.log('login successful');  // WORKS!!!
                                this.goToMainApp();  // FAILS!!!
                            }
                    }
                });

            },
            failure : .....
        });