Sencha Touch TPL和Item
让我解释一下我的问题,我有一个从存储文件加载一些元素的列表视图,当我单击一个列表项时,我有一个控制器在新的详细信息视图中推送数据
'placesContainer places list':{
itemtap: function(list,index,target,record) {
console.log("item "+record.get('name')+" pigiato");
var detailsView = Ext.create('MyApp.view.Details');
this.getPlacesContainer().push(detailsView);
detailsView.setData(record.data);
}
}
好的在这里。现在,我想要的是从我的新详细信息视图中的存储文件加载相同的信息。 以下是我的详细信息视图:
Ext.define('MyApp.view.Details',{
extend:'Ext.Panel',
xtype:'details',
config:{
layout:'vbox',
scrollable:true,
styleHtmlContent:true,
styleHtmlCls:'details',
tpl:'<h1>{name}</h1>' +
'<p><span>Lunghezza:</span> {lunghezza} <span>Difficoltà:</span> {difficulty}</p>' +
'<h2>{prova}</h2>',
items: [
{
xtype: 'panel',
flex:1,
store:'Places',
},
{
xtype: 'carousel',
flex:2,
items: [
{style: "background-color: #7BB300"},
{style: "background-color: #555555"},
{style: "background-color: #00ff2a"},
{style: "background-color: #00bb1f"},
{style: "background-color: #008616"},
{style: "background-color: #00490c"}
]
}
]
}
如果我在项之外编写TPL元素,我可以在详细信息视图中读取数据。当我尝试将TPL元素放入项中时,所有数据都消失了。怎么了? 我尝试了这种方法,但没有结果...
items: [
{
xtype: 'panel',
flex:1,
store:'Places',
tpl:'<h1>{name}</h1>' +
'<p><span>Lunghezza:</span> {lunghezza} <span>Difficoltà:</span> {difficulty}</p>' +
'<h2>{prova}</h2>',
},
items: [
{
xtype: 'panel',
flex:1,
store:'Places',
itemTpl:'<h1>{name}</h1>' +
'<p><span>Lunghezza:</span> {lunghezza} <span>Difficoltà:</span> {difficulty}</p>' +
'<h2>{prova}</h2>',
},
能帮上忙就太好了!
解决方案
您需要对您的itemtap
函数进行小规模更改
'placesContainer places list':{
itemtap: function(list,index,target,record) {
console.log("item "+record.get('name')+" pigiato");
var detailsView = Ext.create('MyApp.view.Details');
this.getPlacesContainer().push(detailsView);
detailsView.setData(record.data); // will set data to detailsview
detailsView.getAt(0).setData(record.data); // will set data to first component in items array
detailsView.getAt(1).setData(record.data); // will set data to second component in items array
.... and so ....
}
}
相关文章