templates - Mustache.js テンプレートで交互の行の色を作成するにはどうすればよいですか?

Question

テンプレートがあります：

{{#people}}
  <div style="background-color: **gray/white**;"><span>{{name}}</span>: <span>{{title}}</span></div>
{{/people}}

コントローラーから渡さずに背景色を設定する方法はありますか? これは純粋な表示であり、結果としてコントローラーに属しているとは思わないため、可能であればそこで色に名前を付けることは避けたいと思います。

Answer 1

コメントで述べたように、Mustacheはこれを解決できませんが、mustache.js固有の方法を見つけました。

var template = '{{#people}}'
  +'  <div style="background-color: {{color}}"><span>{{name}}</span>: <span>{{title}}</span></div>'
  +'{{/people}}'

var data = {
  people: [
    {name: 'a', title: 'b'},
    {name: 'c', title: 'd'},
    {name: 'e', title: 'f'},
    {name: 'g', title: 'h'},
    {name: 'i', title: 'j'},
  ],
  color: function() {
    return window.divcolor = window.divcolor == 'gray' ? 'white' : 'gray'
  }
}

Mustache.to_html(template, data)