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

HTML,CSSの入門記事やブログのカスタマイズについてアウトプットしています。

 menu

【mustache入門:Ruby版】複雑なデータ(セクション)

データがある限り一覧表示する方法を見ていきます。

作成するファイル

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

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

#data.yml(データの記述)
users:
  - name: hoge
    email: hoge@example.com
  - name: fuga
    email: fuga@example.com
{{! template.mustache(テンプレートの記述) }}
{{#users}}
- {{name}} ({{email}})
{{/users}}
{{^users}}
- no user found.
{{/users}}

users配下のnameとemailにアクセスするには、usersセクションの中でアクセスします。

複雑なデータの埋め込みの確認

mustacheコマンドを実行して、複数のデータが埋め込まれるかを確認します。

mustache data.yml template.mustache
- hoge (hoge@example.com)
- fuga (fuga@example.com)

コマンドを実行するとリスト形式でデータが表示されることを確認できると思います。ちなみにusersのデータを空にすると- no user found.と表示されます。

#data.yml(データの記述)
users:
#  - name: hoge
#    email: hoge@example.com
#  - name: fuga
#    email: fuga@example.com
mustache data.yml template.mustache
- no user found.

まとめ

データがある限り表示する方法を見ていきました。繰り返しの処理が簡単に書けることが分かったと思います。

参考サイト