我使用以下命令在容器中动态添加组件:
this.add()
方法
代码:
init: function() {
var combo = new Ext.BoxComponent({
tpl: new Ext.XTemplate("<div>hellow</div>")
})
this.add(combo)
this.doLayout();
}
但是,当我添加Ext.XTemplate()时,它不呈现,但是当我添加Ext.Button或Ext.ComboBox之类的组件时,它们完美呈现。 知道为什么只有它的模板呈现问题吗?
谢谢
答案 0 :(得分:1)
使用语法,我假设它的ExtJS 3.4。
您缺少模板的数据属性。 模板始终需要一个存储或数据参数,该参数被视为其数据源。
init: function() {
var combo = new Ext.BoxComponent({
data: [{name:"Saurabh"}],
tpl: new Ext.XTemplate("<div>{name}</div>")
})
this.add(combo)
this.doLayout();
}
此处正在使用POC代码:
Ext.onReady(function () {
Ext.create({
xtype: 'panel',
renderTo: Ext.getBody(),
title: 'Xtemplate usage demo',
items: [{
xtype: 'panel',
listeners: {
afterrender: function () {
var combo = new Ext.BoxComponent({
data: {name:"Saurabh"},
tpl: new Ext.XTemplate("<div>hellow {name}</div>")
});
var combo2 = new Ext.BoxComponent({
data: [{name:"Saurabh"}, {name: "User1234"}],
tpl: new Ext.XTemplate('<tpl for="."><div>hellow {name}</div></tpl>')
});
this.add(combo);
this.add(combo2);
this.doLayout();
}
}
}]
});
});
以下是工作提琴的链接: https://fiddle.sencha.com/#view/editor&fiddle/2rpg