如何从html文件创建sencha touch xtemplate

时间:2014-07-21 10:59:26

标签: javascript extjs sencha-touch-2

我正在使用以下代码创建sencha touch x模板以显示Ext.List

itemTpl : '<div style="width: 100%;height: 420px"><div style="width: 300px;float: left">' +
            'Wave No: {waveNo}<br/>Description:-{description}<br/></div>' +
            '<div style="width: 300px;float: left">' +
            'No of Hours Planned: {noOfHrsPlanned}<br/>' +
            'No of Hours Completed: {noOfHrsCompleted}<br/>' +
            'No of Hours Remaining: {noOfHrsRemaining}<br/>' +
            '</div><div style="width: 210px; float: left;">' +
            '<canvas id="doughnut{waveNo}" width="200" height="200" style="border:0px solid #000000;"></canvas>' +

            '</div></div>',

字符串中的实际HTML将会非常大。有什么方法可以从html文件中加载整个HTML代码吗?

版本:Sencha Touch 2.3.1

1 个答案:

答案 0 :(得分:1)

您可以使用Ext.Ajax来实现此目的。您只需要执行本地文件的请求。 文件路径相对于app.js文件。

Ext.define('FileLoad.view.Main', {
    extend: 'Ext.Container',
    xtype: 'main',
    requires: [
        'Ext.Ajax'
    ],

    initialize: function () {
        this.callParent( arguments );
        var me = this;
        Ext.Ajax.request({
            url: 'template.html',
            success: function ( response ) {
                me.setHtml( response.responseText    );
            },
            failure: function ( response ) {
                me.setHtml( response.responseText );
            }
        });
    }
});

response.responseText会将html保存为字符串。