In JsRender Template, How to set css of dom element if Array to be iterated contains specifics String values?

Question

In JsRender Template, I have a td that contains iterated elements of array statusShortList

<td style="width:100px;" class="primary-bg">
{{for statusShortList}}{{>#data}}{{if #index < #parent.data.length - 1}}-{{/if}}{{/for}}
</td>

How can I set the td text color if array statusShortList contains String "wappr" ?

Answer 1

Here is one way:

Provide a helper, such as:

var helpers = {
  inArr: function(str, arr) {
    return $.inArray(str, arr) > -1;
  }
};

var html = tmpl.render(data, helpers);

and use it in your template like this:

<td style="width:100px; color:{{:~inArr('wappr', statusShortList) ? 'red' : 'black'}}" class="primary-bg">
  ...