如何根据sencha touch中其他商店中的项目动态设置itemTpl?

时间:2012-06-13 06:19:47

标签: sencha-touch sencha-touch-2

我有2家商店。 SortStore和WorkStore。

这是我在模型中的WorkStore字段:

          {name: 'domainName',type:'string',mapping:'DomainName'},
          {name: 'objectId',type:'string',mapping:'ObjectID'},
          {name: 'serverName',type:'string',mapping:'ServerName'}, 
          {name: 'sourceWorkset',type:'string',mapping:'SourceWorkset'},
          {name: 'sourceWorkstep',type:'string',mapping:'SourceWorkstep'}, 

这是模型中的SortStore字段:

         ['name', 'value']

我想根据sortstore中的项目在列表中显示来自workstore的数据。如果sort store具有域名和对象ID。该列表应仅填充工作区中的值。商店通过webservice调用动态加载商店。

       {
            xtype:'list',
            id:'workitemlist',
             // store:'WorkitemStore',
            itemTpl:'<table><tr><td valign="top"><img src="{workitemImage}" width=20px height=22px />' +
                '&nbsp;&nbsp;</td><td><span><b>{workitemName}</b></span> <br/>' +
                '<span class="label">Object Id:</span> {objectId} <br /><span class="label">' +
                'Source Workstep: </span>{sourceWorkstep}</td> </tr></table>'


        }

我不需要在itemTpl中打印所有这些,而只需要在sortstore中存在的那些内容来填充。如何根据其他商店中的项目动态设置此itemTpl。任何帮助表示赞赏。

2 个答案:

答案 0 :(得分:1)

我们可以这样动态设置itemTpl:

  var template = '<table><tr><td valign="top"><img src="{Image}"' +
        ' width=20px height=22px />' +
        '&nbsp;&nbsp;</td><td><span><b>{Name}</b></span> <br/>';
    var myStore = Ext.getStore('RealStore');
    if (myStore != null) {
        myStore.each(function (record) {
            if (record.get('field')) {
                template += '<span class="label">Domain Name:</span>' +
                    ' {field} <br/>';
            }
  }

答案 1 :(得分:0)

不确定这是否是最好的方式,但我过去实现它的方式是保留templateId的JSON(使用区分字段,例如“tpl _”+ field)&amp;我的应用程序的templateContent并在变量(tpls)中启动时加载它。一旦加载,我可以从任何地方引用它:

var styleTemplate = eval('tpls.tpl_' + rec.field);

然后将其传递给列表:

{
xtype: 'list',
itemTpl : styleTemplate,
store : listStore,
id : 'ilid',
layout : 'fit'
}