Javascript 扩展Sencha触摸对象

我试图在Sencha Touch框架中扩展Ext.Container对象，以添加我需要的一些额外属性，其中之一就是通过AJAX加载文件

App.Ext.AContainer = Ext.extend(Ext.Container, {
ajax : false,
doAjax : function(p, that) {
    Ext.Ajax.request({
        url : p,
        method : 'POST',
        success : function(result) {
            Ext.apply(that, {
                html : result.responseText
            })
        },
        failure : function(result) {
            Ext.Msg.alert('ERROR : AJAX : Could not load ' + p);
        }
    })
},
constructor : function(b) {

    if( b.ajax === true && b.hasOwnProperty('rhtml')) {
        this.doAjax(b.rhtml, this);
    }

    App.Ext.AContainer.superclass.constructor.call(this, b);

    console.log(this);

}
});

该容器的实际实现为：

var servicesContainer = new App.Ext.AContainer({
  scroll : 'vertical',
  ajax : true,
  rhtml : 'test.html'
});

基本上，我的想法是有一个方法，负责加载文件，然后手动将其复制到html属性。当我检查控制台是否输出“this”时，它显示html属性设置了正确的标记，但它没有将标记呈现给页面

不太确定我做错了什么。

查看构造函数中的if。它调用doAjax，doAjax反过来调用Ext.Ajax.request，其参数中包含success函数。报告说：

这意味着，在加载完成之前，控制流立即返回到构造函数，我猜甚至在发送请求之前

因此，在调用console.log时，请求和success函数尚未执行

TL；博士：

---

将console.log调用移动到success函数。

此外，不需要将作用域传递给doAjax，而是：

App.Ext.AContainer = Ext.extend(Ext.Container, {
    ajax: false,
    doAjax: function (p) {
        Ext.Ajax.request({
            url: p,
            method: 'POST',
            scope: this,
            success: function (result) {
                this.html = result.responseText;
            },
            failure: function (result) {
                Ext.Msg.alert('ERROR : AJAX : Could not load ' + p);
            }
        })
    },
    constructor: function (b) {

        if (b.ajax === true && b.hasOwnProperty('rhtml')) {
            this.doAjax(b.rhtml);
        }

        App.Ext.AContainer.superclass.constructor.call(this, b);

        console.log(this);

    }
});

---

我想出来了。除了我的范围有点模糊之外，我不应该将ajax响应传递给this.html，而是应该将其传递给this.el.dom.firstChild.innerHTML。

App.Ext.AContainer = Ext.extend(Ext.Container, {
    ajax: false,
    doAjax: function (p) {
        Ext.Ajax.request({
            url: p,
            method: 'POST',
            scope: this,
            success: function (result) {
                this.html = result.responseText;
            },
            failure: function (result) {
                Ext.Msg.alert('ERROR : AJAX : Could not load ' + p);
            }
        })
    },
    constructor: function (b) {

        if (b.ajax === true && b.hasOwnProperty('rhtml')) {
            this.doAjax(b.rhtml);
        }

        App.Ext.AContainer.superclass.constructor.call(this, b);

        console.log(this);

    }
});