ifとeach_with_indexで条件に応じたViewを表示させる

ブログサイトで、

1)広告があれば大見出しに広告を入れて、その下にブログ記事を配置

2)広告がなければ大見出しにブログ記事の1つめを配置

といった具合に、場合によってデザインを分けたい。

完成形のイメージ

DBは説明のため簡略化して考える

記事テーブルと広告テーブルのみ考える

コントローラー

HomeController

def index
	@articles = Article.all
	@affiliate = Affiliate.where(end_flag: false)
end

Viewにわたす記事、広告のデータをインスタンス変数として定義するだけのシンプルなもの。広告は一定期間出して、出し終わったらend_flagがtrueになるものと考える。

ビュー

index.html.erb

<section>
	<% if @affiliate.present? %>
	<div class="大見出し用のボックス">
		<h1><%= link_to "#{@affiliate.title}", affiliate_path(@affiliate.affiliate_id) %></h1>
	</div>
	<% is_no_affiliate = false %>
	<% else %>
	<% is_no_affiliate = true %>
	<% end %>

	<% @articles.each_with_index do |article, index| %>
	<% if index == 0 && is_no_affiliate %>
	<div class="大見出し用のボックス">
		<h1><%= link_to "#{article.title}", article_path(@article.article_id) %></h1>
	</div>
	<% end %>
	<div class="小さい見出し用のボックス">
		<h1><%= link_to "#{article.title}", article_path(@article.article_id) %></h1>
	</div>
	<% end %>
</section>

Viewの処理の解説

1. if @affiliate.present?で、広告が存在する場合に大見出し用のボックスを表示させる
2. 広告が存在する場合、is_no_affiliate = falseとして記事の表示を分岐させるトリガーとして変数を用意する
3. 広告が存在しない場合はis_no_affiliate = true とする。
4. @articles.each_with_index do |article, index| で@articlesの中身をそれぞれ取り出して、順番にindex(0,1,2,~~)を付与
5. 最初の記事(index == 0)かつ、広告がない(is_no_affiliate = true )場合は、最初の記事を大見出し用のボックスで表示させて、それ以外は順番に小さい見出し用のボックスで表示させる。