我刚刚创建了一个包含数据的商店,然后在我的查看中创建了一个连接到该商店的列表以显示商店数据,一切正常,直到某些点我想调用函数而不是直接显示值,以便在之前对进行某些操作,我怎样才能实现这一点在 itemTpl 配置。
查看=> Declaration.js
Ext.define('ALNadeebApp.view.declaration.Declaration',
{
extend: 'Ext.panel.Panel',
xtype: 'declaration',
requires: [
'ALNadeebApp.view.declaration.DeclarationController',
'ALNadeebApp.view.declaration.DeclarationItems',
'ALNadeebApp.view.declaration.DeclarationModel'
],
fullscreen: 'true',
getProcessingMsg: function (msg) {
return getDeclarationProcessingStatus(msg);
},
title: "البيانات",
layout: 'fit',
cls: 'declarations',
scrollable: 'y',
controller: 'declaration',
viewModel: 'declarationModel',
items: [
{
xtype: 'list',
reference: 'declarationlist',
scrollable: 'y',
plugins: [
{
xclass: 'Ext.plugin.ListPaging',
autoPaging: true
}
],
itemTpl: '<div class="declaration-item">' +
'<div class="declaration-header">' +
'{declarationNo} : رقم البيان' +
'</div>' +
'<div class="right-part">' +
' {declarationType} : الطلب <br>' +
'التاريخ :{createdDate} | الوقت : {createdDate}' +
'</div> ' +
'<span class="declaration-status">{processingStatus}</span>' +
'</div>',
listeners: {
itemtap: 'onListItemTap'
},
store: {
type: 'declarationitems'
},
itemHeight: '100px',
items: [
{
scrollDock: 'top',
docked: 'top',
xtype: 'fieldset',
items: [
{
xtype: 'searchfield',
name: 'query',
placeHolder: 'ابحث برقم البيان',
inputCls: 'search-field'
},
{
xtype: 'label',
html: 'بحث متقدم',
cls: 'advanced-search-label'
}
]
},
{
xtype: 'button',
scrollDock: 'bottom',
docked: 'bottom',
text: 'المزيد ...',
handler: 'onLoadMoreTabed'
}]
}
]
});
Store =&gt; DeclarationItems.js
/**
* Created by M.Shebl on 10/16/2016.
*/
Ext.define('ALNadeebApp.view.declaration.DeclarationItems', {
extend: 'Ext.data.Store',
requires: [
'ALNadeebApp.view.declaration.DeclarationItem'
],
alias: 'store.declarationitems',
model: 'ALNadeebApp.view.declaration.DeclarationItem',
data: [
{"amendingByInspector":false,"containerFlag":"\u0000","createdBy":"5678567820120000005","createdDate":1476248246000,"declarationId":6013076,"declarationNo":"5LI41000030735","declarationPartyDTOs":[{"accountCode":"L1570","checkBox":false,"declarationUpdatedPartyDTOList":[],"forBatchUpdate":false,"forListUpdate":false,"individualFlag":false,"partyName":"منجرة كاظم","partyType":"IM","selected":false},{"checkBox":false,"declarationUpdatedPartyDTOList":[],"forBatchUpdate":false,"forListUpdate":false,"individualFlag":false,"partyName":"123","partyType":"EX","selected":false}],"declarationProvisionalNo":"201610128674","declarationStatus":"SUB","declarationType":"IMP","harbourFlag":false,"inspectionOffshore":"\u0000","onsiteInspectionApproval":"\u0000","processingStatus":"PIN","reuseNumber":false,"rownum_":1,"rulesResult":false,"statisticalDeclaration":"\u0000","strategicGoodsFlag":"\u0000","submittedDate":1476248277000,"version":0,"wsDeclarationBillOfLadingDTO":{"billOfLadingId":5994648,"blDetailsPopulatedFromManifest":false,"carrierInfoDTOList":[{"carrierNationality":"QA - QATAR","carrierNationalityArabic":"QA - قطر","carrierNo":"12320151729","chassisNo":"12345672015172935","driverName":"احفثسف","driverNationality":"QA - QATAR","driverNationalityArabic":"QA - قطر","gatePassNumber":"2123","selectedModelRow":0}],"countryOfLoading":"AF - AFGHANISTAN","countryOfLoadingArabic":"AF - أفغانستان","declarationId":6013076,"finalDestination":"QA - QATAR","finalDestinationArabic":"QA - قطر","isFinalDestinationBlankInManifest":false,"isPortOfLoadingBlankInManifest":false,"noOfPackages":1,"noOfPackagesUom":"BAG","showPopupBtn":false}},
{"amendingByInspector":false,"containerFlag":"\u0000","createdBy":"5678567820120000005","createdDate":1475748148000,"declarationId":6012889,"declarationNo":"5LI41000030618-1","declarationPartyDTOs":[{"accountCode":"1003","checkBox":false,"declarationUpdatedPartyDTOList":[],"forBatchUpdate":false,"forListUpdate":false,"individualFlag":false,"partyName":"Clearing Agency A","partyType":"IM","selected":false},{"checkBox":false,"declarationUpdatedPartyDTOList":[],"forBatchUpdate":false,"forListUpdate":false,"individualFlag":false,"partyName":"tamer-test-amendment","partyType":"EX","selected":false}],"declarationProvisionalNo":"201610068487","declarationStatus":"SUB","declarationType":"IMP","harbourFlag":false,"inspectionOffshore":"\u0000","onsiteInspectionApproval":"\u0000","processingStatus":"PIN","reuseNumber":false,"rownum_":2,"rulesResult":false,"statisticalDeclaration":"\u0000","strategicGoodsFlag":"\u0000","submittedDate":1475748261000,"version":0,"wsDeclarationBillOfLadingDTO":{"billOfLadingId":5994492,"blDetailsPopulatedFromManifest":false,"carrierInfoDTOList":[{"carrierNationality":"QA - QATAR","carrierNationalityArabic":"QA - قطر","carrierNo":"12320151729","chassisNo":"12345672015172935","driverName":"احفثسف","driverNationality":"QA - QATAR","driverNationalityArabic":"QA - قطر","gatePassNumber":"2123","selectedModelRow":0}],"countryOfLoading":"IT - ITALY","countryOfLoadingArabic":"IT - إيطاليا","declarationId":6012889,"finalDestination":"QA - QATAR","finalDestinationArabic":"QA - قطر","isFinalDestinationBlankInManifest":false,"isPortOfLoadingBlankInManifest":false,"noOfPackages":1,"noOfPackagesUom":"KG","portOfLoading":"ITQCM - Como","portOfLoadingArabic":"ITQCM - Como","portOfLoadingType":"A","showPopupBtn":false}}
]
});
答案 0 :(得分:1)
您可以将格式化功能作为模板的一部分附加:
Ext.application({
name: 'Fiddle',
launch: function() {
Ext.Viewport.add({
xtype: 'list',
itemTpl: ['{name:this.doIt}', {
doIt: function(v) {
return v + ' go';
}
}],
store: {
fields: ['name'],
data: [{
name: 'A'
}]
}
});
}
});
小提琴here。
答案 1 :(得分:0)
itemTpl: Ext.create('Ext.XTemplate',
'<tpl for=".">',
'{[this.formatValue(values.price)]} ...',
'</tpl>', {
formatValue: function(v) {
return v + ' €';
}
})
}