2016-11-08 59 views
0

我剛剛創建了一個其中包含了數據,然後在我的查看我創建了一個列表連接到店裏來顯示存儲數據,一切工作正常,直到一些點我想調用函數而不是直接顯示值,使該值之前渲染之前,我怎麼能做到這一點itemTpl配置一些操作。評估在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' 
       }] 
     } 
    ] 
}); 

商店=> 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}} 
    ] 
}); 

回答

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

0
itemTpl: Ext.create('Ext.XTemplate', 
      '<tpl for=".">', 
      '{[this.formatValue(values.price)]} ...', 
      '</tpl>', { 
      formatValue: function(v) { 
       return v + ' €'; 
      } 
     }) 
}