Kha*_*war 2 javascript template-engine extjs sencha-touch sencha-touch-2
嗨,我是 Sencha touch 的新手。我在Ext.dataview.List用itemTpl. 这就是我设置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>'
),
Run Code Online (Sandbox Code Playgroud)
它运行良好并显示产品列表。但是现在我只需要更改第一条记录的 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>'
),
Run Code Online (Sandbox Code Playgroud)
问题是if/elseif对每条记录都执行。如果我使用if/else它会在控制台中出错。
Uncaught SyntaxError: Unexpected token else
Run Code Online (Sandbox Code Playgroud)
你可以看到我用过
'<tpl if={isBanner} === true>',
我也用过
'<tpl if={isBanner} == true>',
Run Code Online (Sandbox Code Playgroud)
我也尝试过很多变体,比如比较数值而不是布尔值和使用>or <。还尝试比较字符串值。但是对于所有变体,它们if/elseif都在执行并if/else给出错误。
任何帮助表示赞赏,我只需要更改类以获取第一条记录。
如果 isBanner 是布尔值,这将起作用
'<tpl if="isBanner">',
'<div class="myTestClass">{itemImage}</div>',
'<tpl else>',
'<div class="featureImageHolder"><img class="featureImage" src="{itemImage}" alt="{itemName}" /></div>',
'</tpl>',
Run Code Online (Sandbox Code Playgroud)