Handlebars.jsの使い方 registerHelper

HTML

<div id="output"></div>

template

{{#list people}}{{firstName}} {{lastName}}{{/list}}
{{#links data}}{{/links}}

JavaScript

var values = {
  people: [
    {firstName: "Sato", lastName: "Suzuko"},
    {firstName: "Yamada", lastName: "Taro"}
  ],
  data: [
    {name: 'Google', url: 'https://www.google.co.jp/'},
    {name: 'Yahoo', url: 'http://www.yahoo.co.jp/'}
  ]
}
Handlebars.registerHelper('list', function(items, options) {
  var out = '
';
  items.forEach(function(val) {
    out += '
' + options.fn(val) + '
';
  });
  return out + '
';
});
Handlebars.registerHelper('links', function(items) {
  var out = '
';
  items.forEach(function(val) {
    out += '
' + val.name + '
';
  });
  return out + '
';
});
function $(selector) {
  return document.querySelector(selector);
}
var template = Handlebars.compile($('#input').innerHTML);
$('#output').innerHTML = template(values);