テンプレートファイルの中身が多くなるとコードの見通しが悪くなります。そこでテンプレートの一部分を部品化して、別ファイルに切り出す方法を見ていきます。
作成するファイル
- データファイル:data.yml
- テンプレートファイル:template.mustache
- テンプレートファイル:user.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}}
テンプレートの部品化
template.mustacheの- {{name}} ({{email}})
の部分を別ファイルに切り出します。ファイル名は、user.mustacheとします。
{{! user.mustache(テンプレートの記述) }} - {{name}} ({{email}})
template.mustacheの切り出した部分を{{> user}}
に置き換えます。
{{! template.mustache(テンプレートの記述) }}
{{#users}}
{{> user}}
{{/users}}
{{^users}}
- no user found.
{{/users}}
部品化の確認
mustacheコマンドを実行して、切り出し前と同じ結果になることを確認します。
mustache data.yml template.mustache - hoge (hoge@example.com) - fuga (fuga@example.com)
まとめ
テンプレートファイルの一部分を部品化することに成功しました。これで色々なファイルに部品を読み込んで、再利用できるようになりました。