javascript - 如何将 XTemplate 放置在 Ext.Panel 内？

Question

我正在学习 extjs，我很好奇如何在面板中添加 XTemplate。以下代码是我迄今为止可以使用的代码，但“apply”函数不会将“{name}”和“{age}”替换为“smith”或“21”。我假设我忘记做某事或者我没有正确使用 Xtemplate。有什么建议吗？

var tpl = new Ext.XTemplate('Name: {name}<br>Age: {age}');
tpl.apply({
    name:'smith',
    age:21
});
tpl.compile();


var northEastPanel = new Ext.Panel({
    flex: 1,
    autoHeight:true,
    border:false,
    frame:true,
    layout:'form',
    items:[tpl]
});

谢谢，Y_Y

Answer 1

items 配置仅适用于 Ext 组件。您必须将生成的 html 代码放入 Panel 的 html 配置中:

var generatedHtml = tpl.apply({
    name:'smith',
    age:21
});

var northEastPanel = new Ext.Panel({
    // not items but html:
    html: generatedHtml,
    // ...
});