Xtemplate if conditions in sencha touch

Question

I have the following Xtemplate code:

('Ext.XTemplate',
    '<div class="moreArrow"></div>',
    '<div class="img"><img src="http://localhost/WL2/assets/rest/{image}"/></div>',                       
    '<div class="meta">',
    '<h3>{merchName}</h3>',
    '<div class="actions">',
        '<button class="seen{[values.seen ? " selected" : ""]}">{action}</button>',
        '{% if (values.seen) { %}',
            '<button class="thumb up{[values.like ? " selected" : ""]}"><b></b></button>',
            '<button class="thumb down{[values.dislike ? "selected" : ""]}"><b></b>  </button>',
        '{% } else { %}',
            '<button class="want{[values.wantToSee ? "selected" : ""]}">Want to Go There</button>',
        '{% } %}',
        '</div>',
    '</div>'
)

My problem is that the if condition in the part {% if (values.seen) { %} is not working, that is when the button is clicked, it should show two buttons of dislike and like. What is wrong with my code that is causing this issue?

Answer 1

It might not be working because you are not comparing it with anything.

BTW, here are few examples to understand how to use if condition:

Using comparison operators:

<tpl if="totalDiscount &gt; 0">

Using 'AND' operator

<tpl if="active == true && available == true">

Using XTemplates variables:

'{% if (xindex % 2 === 1) { %}' +
    '<div>Odd Row</div>' +
'{% } %}'