わすれたあかんえ

Railsのviewにデザインを組み込む人のつぶやき。

Railsのviewの中でCSSクラスを複数出し分けたい

Rails だと、ひとつのテンプレートファイルを複数の controller で使いまわすことがよくあります。

その場合にテンプレートの中で、CSS のクラスを呼び出すページによって出し分けしたいときがよくありますが、だいたいこういうふうにやってますよね。

// 現在表示しているページが /hoge/foo/ だったら .bar をつける
%div{ class: current_page?(controller: 'hoge', action: 'foo') ? 'bar' : nil }

このときに、条件分岐したい要素にすでにこんなクラスがついてたりします。

%div{ class: "bar #{@nya.name}" }

こうなったときに上記のcurrent_page?をこの中に一緒に書く方法がわからず、何度か諦めてたのですが、先日ふと以下のように書いてみたらできました。

%div{ class: "bar #{@nya.name} #{current_page?(controller: 'hoge', action: 'foo') ? 'bar' : nil}" }

普通に#{}で囲めばいいだけでした。

今思えばなんで気付かなかった、と思うんですがあやふやな知識で"#{}"を使っていたからですねc⌒っ.ω.)っ
(そして"#{}"をなんと呼ぶのかわからない……)

知ってる人には当たり前かもしれませんが、ググろうにもググるワードがわからず諦めてきたのでメモ。