4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Rails】初心者の為の部分テンプレートの使い方

Last updated at Posted at 2019-09-01

#部分テンプレートとは
部分テンプレートはenderメソッドを使うことで指定でき、重複するHTMLの記述部分を文字通りテンプレ化する事で、共通化して綺麗にまとめる事が出来ます。

部分テンプレートを上手く使えば、コードを綺麗にまとめる事が出来るのは勿論のこと、修正するときも楽になりますし、コードを描くにあたって必須になってきますので、今のうちに基礎を抑えておきましょう。

##部分テンプレート内で変数を使う
まず、partialで部分テンプレートのファイルを指定します。この時ディレクトリの位置と、ファイル名に注意してください(※部分テンプレートのファイル名は_から始めます)。
例えば、tweets/index.html.haml内で、shared/_item.html.hamlを指定したいときは、このように書きます。

index.html.haml
= render partial: 'shared/item', locals: {items:@items, word: 'レディース' }

大抵の場合controllerで指定したインスタンス変数を部分テンプレート先で使用したい事が多いです。
この時、localsを使用します。

index.html.haml
= render partial: 'item', locals: { '指定先で使いたい変数名':'持っていく変数名' }

partialは省略することも可能ですが、上記のように変数を指定するときは省略は出来ません。

##部分テンプレート内でeach処理をする
each文で、@itemsを一つずつ取り出したいとき、部分テンプレート先でeach文を使うことももちろん出来ますが、collectionオプションを使って複数形の変数を渡すと、部分テンプレート先でeach文を使用せずに繰り返し処理をしてくれるので便利です。
更に、@itemsを、_item.html.haml内で、itemとして繰り返し処理したい時にpartialもcollectioinも省略して、render @itemsだけにする事ができます。

つまり、

index.html.haml
- @items.each do |item|
  = render partial: 'item', locals: { item: item }

⬆️これを

index.html.haml
= render partial: 'item', collection: @items

⬆︎こうして

index.html.haml
= render @items

こうできます!

だいぶスッキリしましたね〜!

4
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?