Handlebarsメモ
HandlebarsはMustacheをベースに開発されたテンプレートエンジンです。 細かい使用方法は公式サイトで詳しく説明されています。
少し試している中でif文での比較を行いたい部分があったのですが どうやらデフォルトではサポートしていないみたい。
具体的には、
{{#if length == 0}} No length {{else}} length exist {{/if}}
みたいに書きたかったのですがだめでした。
調べてみるとやはりサポートしていないようでBlock Helperを自分で定義する必要があるみたい。元から用意されているビルドインヘルパーの#ifは単純に値が存在するかしか見てくれない様子。 まあViewにごちゃごちゃとコードを書かないでViewとロジックを分離させようという方針のものなので自然なことかと思いました。
このことについてはここで議論されていました。
ということで比較ヘルパーを定義します。 ここで同じ事を行なっている人がいたので使わせてもらいました。
例えばequalという名前のヘルパーを登録するときは以下のように行います。 ヘルパーの登録方法についても公式ページにきちんと書いてあります。
Handlebars.registerHelper('equal', function(lvalue, rvalue, options) {
//処理
});
これにより、以下のように書けるようになります。
{{#equal length 0}} No length {{else}} length exist {{/equal}}
ちょうどBackbone.jsのTodoアプリのサンプルでこれを使える部分があったので使ってみました。BackboneのTodoアプリサンプルはunderscore.jsのテンプレート(_.template)を使っているのですが、これをHandlebarsを使うように置き換えています。
ヘルパー部分は分かりやすいようにhandlebars-helper.jsと分けています。
