Sencha touch - Ext.XTemplate if / else not working

时间:2014-03-06 09:25:00

标签: javascript extjs sencha-touch sencha-touch-2 template-engine

嗨,我是Sencha touch的新手。我在使用Ext.dataview.ListitemTpl中显示数据时遇到问题。这是我在itemTpl

中设置config的方法
itemTpl: new Ext.XTemplate(

            '<div class="featureImageHolder"><img class="featureImage" src="{itemImage}" alt="{itemName}" /></div>',

            '<span class="item">',
                '<h3 class="saleName">{itemName}</h3>',
                '<span class="priceOptions">',
                '<tpl for="prices">',
                    '<span class="priceOptionReg">',
                        '<tpl if="priceOptionDesc">{priceOptionDesc}</tpl> ',
                        '<tpl if="priceOptionReg">{priceOptionReg}</tpl>  ',
                        '<tpl if="priceReg">${priceReg}</tpl>  ',
                        '<tpl if="priceRegSuffix">{priceRegSuffix}</tpl> ',
                    '</span>',
                    '<tpl if="priceSale"><span class="priceOptionSale">',
                        '<tpl if="priceSaleDesc">{priceSaleDesc}</tpl> ',
                        '<tpl if="priceOptionSale">{priceOptionSale}</tpl>  ',
                        '<tpl if="priceSale">${priceSale}</tpl>',
                        '<tpl if="priceSaleSuffix">{priceSaleSuffix}</tpl> ',
                    '</span></tpl>',
                '</tpl>',
                '</span>',
            '</span>',
            '<div class="clear"></div>'
        ),

它完美地工作并显示产品列表。但是现在我需要更改第一个记录的CSS类,因为它是一个广告横幅。所以我使用以下if语句:

itemTpl: new Ext.XTemplate(
                '<tpl if={isBanner} === true>',
                    '<div class="myTestClass">{itemImage}</div>',

                '<tpl elseif={isBanner} === false>',
                    '<div class="featureImageHolder"><img class="featureImage" src="{itemImage}" alt="{itemName}" /></div>',
                '</tpl>',


                '<span class="item">',
                    '<h3 class="saleName">{itemName}</h3>',
                    '<span class="priceOptions">',
                    '<tpl for="prices">',
                        '<span class="priceOptionReg">',
                            '<tpl if="priceOptionDesc">{priceOptionDesc}</tpl> ',
                            '<tpl if="priceOptionReg">{priceOptionReg}</tpl>  ',
                            '<tpl if="priceReg">${priceReg}</tpl>  ',
                            '<tpl if="priceRegSuffix">{priceRegSuffix}</tpl> ',
                        '</span>',
                        '<tpl if="priceSale"><span class="priceOptionSale">',
                            '<tpl if="priceSaleDesc">{priceSaleDesc}</tpl> ',
                            '<tpl if="priceOptionSale">{priceOptionSale}</tpl>  ',
                            '<tpl if="priceSale">${priceSale}</tpl>',
                            '<tpl if="priceSaleSuffix">{priceSaleSuffix}</tpl> ',
                        '</span></tpl>',
                    '</tpl>',
                    '</span>',
                '</span>',
                '<div class="clear"></div>'
            ),

问题是if/elseif都针对每条记录执行。如果我使用if/else,则会在控制台中出错。

Uncaught SyntaxError: Unexpected token else 

你可以看到我用过

'<tpl if={isBanner} === true>',

我也用过

'<tpl if={isBanner} == true>',

我还尝试了许多变量,例如比较数值而不是布尔值,并使用&gt;&lt;。还尝试比较字符串值。但是对于所有变体,if/elseif都在执行,if/else会出错。

感谢任何帮助,我只需要改变第一个班级的课程。

1 个答案:

答案 0 :(得分:3)

如果isBanner是布尔值,这将起作用

'<tpl if="isBanner">',
     '<div class="myTestClass">{itemImage}</div>',
'<tpl else>',
     '<div class="featureImageHolder"><img class="featureImage" src="{itemImage}" alt="{itemName}" /></div>',
'</tpl>',