元Webデザイナー兼コーダーの備忘録

ウェブデザインやプログラミング、ブログのカスタマイズなどについてアウトプットしています。

 メニュー

» HTML入門のまとめはこちらです。

【mustache入門:Ruby版】真偽値(セクション)

セクションという塊を作り、真偽値の値によって表示を出し分けます。

作成するファイル

  • データファイル:data.yml
  • テンプレートファイル:template.mustache

データファイルとテンプレートファイルを以下のように作成します。

#data.yml(データの記述)
id: 1
showId: true
{{! template.mustache(テンプレートの記述) }}
{{#showId}}
- {{id}}
{{/showId}}

{{#xxx}}でセクションを開始し、{{/xxx}}でセクションを終了します。

真偽値による表示の確認

mustacheコマンドを実行して、表示を確認します。

mustache data.yml template.mustache
- 1

真偽値がtrueなので、1と表示されます。ちなみに、showIdをfalseにすると何も表示されません。

真偽値に応じてテンプレートの表示を切り替える

trueの場合とfalseの場合で、表示を切り替える方法を見ていきます。

#data.yml(データの記述)
id: 1
# showId: true
showId: false
{{! template.mustache(テンプレートの記述) }}
{{#showId}}
- {{id}}
{{/showId}}
{{^showId}}
- id not available
{{/showId}}
  • {{#xxx}}~{{/xxx}}
    • trueの場合、この中身が表示される。
  • {{^xxx}}~{{/xxx}}
    • falseの場合、この中身が表示される。

真偽値による表示の切り替えの確認

mustacheコマンドを実行して、表示が切り替わるかを確認します。

mustache data.yml template.mustache
- id not available

今回は真偽値をfalseにしたので、{{^showId}}~{{/showId}}の中身が表示されます。

まとめ

真偽値の値によって表示を出し分ける方法を見てきました。

参考サイト

» HTML入門のまとめはこちらです。