Sencha Touch 2 フレームワークを使用してテンプレートからパネルを作成しようとしていますが、少し問題があります。私がやりたいのは、HTML テンプレートとその下のボタンを表示することです。テンプレートの代わりに HTML を使用する例は次のようになります。
Ext.define('GS.view.Home', {
extend: 'Ext.Panel',
config: {
title: 'Home',
items: [
{
xtype: 'panel',
html: [
'<img src="resources/images/someImage.gif"/>',
'<h1>A Header</h1>',
"<p>some text</p>"
].join("")
},
{
xtype: 'button',
text: 'Click Me',
ui: 'forward'
}
]
}
});
レンダリングすると次のようになります。
私がやりたいのは、代わりにテンプレートを使用してパネルをロードすることですが、その下にはまだボタンがあります。私のコードは現在、次のようになっています。
var tpl = new Ext.XTemplate(
'<img src="resources/images/someImage.gif"/>',
'<h1>A Header</h1>',
'<p>some text</p>',
{
// XTemplate configuration:
compiled: true
}
);
Ext.define('GS.view.Home', {
extend: 'Ext.Panel',
xtype: 'home',
config: {
title: 'Home',
tpl: tpl,
data: [],
items: [
{
xtype: 'button',
text: 'Click Me',
ui: 'forward'
}
]
}
});
ただし、これにより、ボタンがテンプレート HTML の上に配置されます。
また、テンプレートに設定された tpl 値を使用して項目配列にパネルを追加しようとしましたが、これにより HTML がまったくレンダリングされません。
テンプレートを使用する方法を知っている人はいますが、下部にボタンがありますか? あなたの答えが、正しいクラス名のボタンをテンプレート html に含めることだけである場合、それをコントローラーにリンクするにはどうすればよいですか? (通常、itemId 構成プロパティを使用します)。
乾杯、
ジェームズ