Sencha touch Sencha XTemplates与来自控制器的调用有关
我在使用XTemplates和MVC结构时遇到了一些困难。我已经阅读了一些教程,它们本身是有意义的,但当我试图将它们应用到我试图完成的事情上时,效果并不理想 首先,我的应用程序由TabBarMVC和几个视图组成。某些视图将具有“子视图”。我让应用程序从“布局”的角度工作。选项卡是选项卡,视图可以访问子视图。现在的问题是将数据发送到子视图 我的账单页到详细页就是一个例子。在账单页面中,用户可以输入要拆分账单的总人数和人数。我的控制器接受这两个参数并将它们分割并存储在“来宾”对象中。我的来宾对象将是1-x个来宾对象的数组。基于要拆分的数字 然后,我将该对象发送到我的子视图中的更新方法,以更新XTemplate,但这并没有发生。我可以提醒对象,并在调试器中查看数据,但我不知道如何更新Xtemplate 以下是控制器代码:Sencha touch Sencha XTemplates与来自控制器的调用有关,sencha-touch,extjs,Sencha Touch,Extjs,我在使用XTemplates和MVC结构时遇到了一些困难。我已经阅读了一些教程,它们本身是有意义的,但当我试图将它们应用到我试图完成的事情上时,效果并不理想 首先,我的应用程序由TabBarMVC和几个视图组成。某些视图将具有“子视图”。我让应用程序从“布局”的角度工作。选项卡是选项卡,视图可以访问子视图。现在的问题是将数据发送到子视图 我的账单页到详细页就是一个例子。在账单页面中,用户可以输入要拆分账单的总人数和人数。我的控制器接受这两个参数并将它们分割并存储在“来宾”对象中。我的来宾对象将是
splitdetail: function(options)
{
if ( ! this.splitdetailView)
{
var totalBill = options.data['totalBill'];
var numGuests = options.data['splitBy'];
var totalPerGuest = totalBill / numGuests;
var guestObject = new Array();
var theGuest;
for (var i=0; i<numGuests; i++) {
theGuest = {amount: totalPerGuest}
guestObject.push(theGuest);
}
app.views.calculatorSplitDetail.updateWithRecord(guestObject);
this.splitdetailView = this.render({
xtype: 'CalculatorSplitDetail',
switchAnimation: { type: 'slide'}
});
}
this.application.viewport.setActiveItem(this.splitdetailView, 'slide');
},
这是我的分割细节
var guestTemplate = new Ext.XTemplate(
'<tpl for=".">',
'<div class=" x-field guest-amount-row x-field-number x-label-align-left">',
'<div class="x-form-label" style="width: 30%; ">',
'<span>Total bill</span>',
'</div>',
'<div class="x-form-field-container">',
'<input type="number" name="totalGuestAmount" class="x-input-number" value="{amount}">',
'</div>',
'</div>',
'</tpl>'
);
app.views.CalculatorSplitDetail = Ext.extend(Ext.form.FormPanel, {
initComponent: function() {
Ext.apply(this, {
scroll: false,
items: [
guestTemplate,
]
});
app.views.CalculatorSplitDetail.superclass.initComponent.call(this);
},
styleHtmlContent: true,
baseCls: 'calculator-splitdetail-panel',
updateWithRecord: function(record) {
guestTemplate.apply(record);
alert(record[0].amount);
}
});
Ext.reg('CalculatorSplitDetail', app.views.CalculatorSplitDetail);
guestTemplate只是一个模板,而不是一个控件,因此它无法刷新自身,但它可以为您生成新的html。因此,您只需使用新生成的html更新面板:
updateWithRecord: function(record) {
this.update(guestTemplate.apply(record));
alert(record[0].amount);
}