Sencha Touch change itemTpl on specific items in list - list

Question

I'd like to be able to add class in the Itemtpl where the Item has it's field "Answered" set to "true"
It sound's easy to me, but I don't know where to start..
I know I have to check if Answered is true in the tpl, but I don't know how to write in the template.. o.O
//model
Ext.define('User', {
extend: 'Ext.data.Model',
config: {
idProperty: 'Name',
fields: [
{name: 'Name', type: 'string'},
{name: 'Address', type: 'string'},
{name: 'ID', type: 'int'},
{name: 'WebUrl', type: 'string'},
{name: 'InfoUrl', type: 'string'},
{name: 'Answered', type: 'boolean'},
]
}
});
//store
aStore = Ext.create('Ext.data.Store', {
model: 'User',
sorters: 'Name',
grouper: {
groupFn: function(record) {
return record.get('Name')[0];
}
}
});
//full store
store = Ext.create('Ext.data.Store', {
model: 'User',
sorters: 'Name',
grouper: {
groupFn: function(record) {
return record.get('Name')[0];
}
},
proxy: {
type: 'ajax',
url: '/Services/RestaurantList.ashx',
reader: {
type: 'json',
rootProperty: 'users'
}
},
listeners:{
load: function(){
var all = store.data.all;
aStore.setData(all.slice(0,30));
}
},
autoLoad: true
});
//the list
list = Ext.create('Ext.List', {
flex: 8,
itemTpl: ['<div class="contact">{Name}</div>'],
store: aStore,
listeners: {
itemtap: function(list, index, target, record) {
mainContainer.setActiveItem(1);
detailsPanel.setRecord(record);
},
plugins: [
{
xclass: 'Ext.plugin.PullRefreshFn',
refreshFn: function(){
store.clearData();
aStore.clearData();
store.clearFilter();
aStore.clearFilter();
store.load();
list.refresh();
}
}
],
grouped: true
});

Answer 1

Have you looked at the docs for XTemplate? http://docs.sencha.com/touch/2.2.1/#!/api/Ext.XTemplate. In particular, look at the "Conditional processing with basic comparison operators" section.
If you don't want to use the <tpl if=""> notation, you can also use the ternary operator:
itemTpl: new Ext.XTemplate(
'<div class="{[values.Answered ? \'answered\' : \'\']}">{Name}</div>'
),
...