Railsプログラミングの最大の特徴は「MVC」。Controllerの次はViewの基本をマスターしよう。そこで使われる「ERBテンプレート」とは?, 本コーナーは、技術評論社発行の書籍『Ruby on Rails 4アプリケーションプログラミング』の中から、特にBuild Insiderの読者に有用だと考えられる項目を編集部が選び、同社の許可を得て転載したものです。  『Ruby on Rails 4アプリケーションプログラミング』の詳細や購入は技術評論社のサイトや目次ページをご覧ください。, 本記事は、書籍の内容を改変することなく、そのまま転載したものです。このため用字用語の統一ルールなどはBuild Insiderのそれとは一致しません。あらかじめご了承ください。, 前回は「2.2 コントローラの基本」を説明しました。本稿はその続きです。Railsアプリケーションの作成方法については、第1回から順にお読みください。, 2.2節の例では説明の便宜上、コントローラから出力を直接生成しましたが、Model - View - Controllerの考え方からすると、これはあるべき姿ではありません。最終的な出力には、ERB(Embedded Ruby)テンプレートを利用するのが基本です。, ERBテンプレートは、一言で言うならば、HTML*14にRubyスクリプトを埋め込む(embed)ためのしくみです(図2-8)。HTMLがベースにあるため、最終的な出力をイメージしながら開発を進められるというメリットがあります。, Railsでは、その他にもBuilder、JBuilderのようなテンプレートエンジンを利用できますが*17、まずはERBを理解しておけば、基本的なビュー開発には十分です。, それではさっそく、具体的なサンプルを作成してみましょう。先ほどと同じく「こんにちは、世界!」というメッセージを表示するサンプルです。しかし、今度はコントローラクラスから直接に文字列を出力するのではなく、テンプレートファイルを経由して出力を生成します。, テンプレートを利用する場合にも、まずはリクエスト処理の基点としてのコントローラクラス(アクションメソッド)を準備する必要があります。改めてコントローラクラスから作成しても構いませんが、ここでは、先ほど作成したhelloコントローラにviewアクションを追加するものとします(リスト2-3、追記部分は太字で表しています)。, アクションメソッドが行うべき処理の中でも、ほとんどのアクションで欠かすことができないのがテンプレート変数の設定です。テンプレート変数とは、テンプレートファイルに埋め込むべき値のことで、アクションメソッドとビューとでデータを受け渡しするための橋渡し役となるものです。, プログラム側で表示に必要なデータを用意しておき、テンプレート側ではデータを埋め込む場所や表示方法などを定義する、という役割分担がView - Controllerの基本的な関係です(図2-9)。, Railsでテンプレート変数の役割を担うのは、インスタンス変数です。リスト2-3の例ではインスタンス変数として@msgを設定していますが、これがそのままテンプレート上でも自由に参照できる変数となるわけです。, viewアクションではインスタンス変数@msgひとつに文字列を設定しているだけですが、もちろん複数の変数を設定することもできますし、値には文字列だけでなく、配列や任意のオブジェクトを設定することも可能です。, 続いて、アクションの結果を出力するためのテンプレートファイルを作成します。テンプレートファイルを単独で作成するためのコマンドはないので、ファイルは自分で作成する必要があります*18。, テンプレートファイルは、/app/viewsフォルダ配下に「コントローラ名/ アクション名.html.erb」という名前で保存する必要があります。ここでは、helloコントローラのviewアクションに対応するテンプレートなので、「/hello/view.html.erb」を作成します。これによって、Railsはアクションメソッドを実行した後、対応するテンプレートを検索/実行します。, 「コントローラ名/ アクション名.html.erb」は、テンプレートファイルのデフォルトの検索先です。アクションメソッドで次のように指定することで、使用するテンプレートを自由に変更することもできます*19。以下はhello/special.html.erbを呼び出す例です。, renderメソッドの引数は、/app/viewsフォルダからの相対パスで指定します。また、.html.erbのような拡張子は必要ありません。, テンプレートに対してRubyスクリプトを埋め込むには、< % … % > や< % = … % > のようなブロックを使います。, < % … % > と< % = … % > はよく似ていますが、前者がただブロックの中のコードを実行するだけであるのに対して、後者は与えられた式を出力します。たとえば、以下のような例を見てみましょう。, < % … % > で囲まれたコードは評価されるだけで結果を返しませんので、主に演算や制御構文の記述に利用します。1も演算結果が変数resultに格納されるのみで、結果(文字列)がテンプレートに挿入されることはありません。, 一方、< % = … % > では、式の評価結果をテンプレートに挿入します。よって、2では、変数resultの値が出力にも反映されます。, テンプレートファイルの目的が画面に対してなんらかの出力を行うことであることを考えれば、条件分岐やループなどの制御命令を除けば、ほとんどは< % = … % >の形式で記述することになるでしょう。, < % ...- % > や< % =... - % > のように、スクリプトブロックをハイフン(-)付きで閉じることで、「- % >」の後方のスペースや改行を除去することもできます。厳密なデザインを要求する場合、余計な空白によって意図せぬスペースができてしまうのを防ぐには有効な記法です。, アクションメソッドで設定したテンプレート変数(インスタンス変数)は、テンプレート側でもそのまま「@変数名」の形式で参照できます。ごく直感的な記述ですので、迷うところはないでしょう*20。, 以上が理解できたら、さっそくサンプルを実行してみます。ブラウザから次のアドレスを指定し、図2-10のような結果が得られることを確認してください。, rails generateコマンドでは、コントローラクラス(アクションメソッド)と合わせて、テンプレートファイルを自動生成することもできます。たとえば、以下はhelloコントローラのshowアクションと、対応するテンプレートファイルhello/show.html.erbを自動生成する例です。, 「hello index show new」のようにすることで、複数のアクションをまとめて生成することもできます。生成すべきアクションがあらかじめわかっている場合には、このようにまとめて必要なファイル(やコード)を生成してしまう方が手軽でしょう。, テンプレート変数の設定など、アクションメソッドでの処理が必要ない場合、アクションメソッドは省略できます。たとえば、「http://localhost:3000/hello/nothing」であれば、Railsはまずhelloコントローラのnothingアクションを検索しますが*21、アクションが存在しない場合、そのままテンプレートファイルhello/nothing.html.erbを検索&実行します。, テンプレートファイル(view.html.erb)で定義したものよりも随分多くのコンテンツが出力されていることが確認できます(view.html.erb以外による出力は太字で表しています)。, これら自動で付与されているコンテンツは、実は/app/views/layouts/application.html.erbで定義されているものです*22。, Railsではデフォルトで、application.html.erbの「< % = yield % >」に個別のテンプレートを埋め込んだ上で、最終的な出力を生成します。application.html.erbのことをレイアウトテンプレート、あるいは単にレイアウトと呼びます(図2- 11)。, レイアウトとは、要はサイトデザインの外枠と考えれば良いでしょう。レイアウトを利用することで、ヘッダ/フッタやサイドメニューのようなサイト共通のデザインを一箇所にまとめられますので、以下のようなメリットがあります。, 開発生産性、保守性、ユーザの利便性いずれをとっても、外枠をレイアウトとして別に定義することの重要性はおわかりいただけるのではないでしょうか。, レイアウトの詳細は改めて4.7節(※転載対象外です)で解説しますので、まずはRailsではデフォルトで, ERBテンプレートでは、以下のようなコメント構文を利用できます。以降でもよく利用しますので、ここでよく利用する記法をまとめておきます。, ERB標準のコメント構文で、< % #... % > ブロック配下をすべてコメントと見なします。「%」と「#」の間に空白を挟んではいけません。, 1とよく似ていますが、こちらはRuby標準のコメント構文で、< % ... % >ブロックの配下でのみ利用できます。こちらは「#」からその行末までがコメントと見なされます(単一行コメント)。, 条件分岐構文を利用したコメントアウトです。条件式がfalseですので、常に配下のコンテンツは無視されるというわけです。2の構文は< % … % > の配下でしか利用できませんが、3の記述を利用することで、< % … % > や< % = … % >を跨いだコンテンツをまとめてコメントアウトできます。, デバッグ時に特定の機能やレイアウトを一時的に無効化したい場合にも利用できるでしょう。, 3の構文は確かに便利ですが、問題もあります。というのも、標準的な条件分岐構文をコメントアウトの用途に利用しているため、本来の条件分岐と一見して見分けがつきにくいことがあるのです。, そのような場合には、< % =begin % > … < % =end % > を利用すると良いでしょう。=begin … =end は主にドキュメンテーションコメントを記述するための構文で、Rubyでも複数行コメントに利用する場合があります。3よりも明確にコメントであることを表現できるというメリットがあります。, 4の構文では、必ず「=begin」「=end」は行頭に記述しなければならない点に注意してください。たとえば、以下のような記述はいずれも不可です。, 標準的なHTMLのコメントです。ERBはあくまでHTMLをベースとしていますから、当然、HTMLのコメントも利用できます。ただし、1~4と異なり、ブラウザ側で処理されるコメントですので、配下の内容はクライアント側からも見えてしまう点に注意してください。, エンドユーザが参照する可能性がある情報(サイト管理者の情報など)を記述したり、デバッグ時に出力したHTMLを確認するための目印を埋め込んだりしたい場合に便利です。, ※以下では、本稿の前後を合わせて5回分(第3回~第7回)のみ表示しています。 連載の全タイトルを参照するには、[この記事の連載 INDEX]を参照してください。, 環境が整ったら、いよいよアプリ作成を始めよう。スケルトンコードの生成から、Webサーバー上で実際にRailsアプリを動かすところまでを説明。, Railsプログラミングの基点は、MVCのControllerクラス。ここから具体的なコードを記述していこう。, Railsプログラミングの最大の特徴は「MVC」。ControllerとViewをマスターしたら、最後にModelの基本を習得しよう。データベースをO/Rマッパーで活用する。, 「第1章 イントロダクション」~「第2章 Ruby on Railsの基本」までの転載が完了。まとめて読んでRails開発を学ぼう。, "dSTDVzac0MFzW5kXSE7TZv7bH8S/ggz8PmhaLkmnQE4=", ONLINE SITE 最新情報: 人気記事ランキング Top 100 [5年間], C#による.NET Core入門(6): .NET CoreライブラリプロジェクトをパッケージングしてNuGetサーバーに発行する, テンプレートでデータ加工や条件分岐/繰り返し処理を表現する(Smarty)[PHP], .NET Coreとは? 開発環境(SDKとVisual Studio Code)のインストール, jQuery: 要素の高さ/幅を設定/取得するには?(height/width/innerHeight/innerWidth/outerHeight/outerWidth), jQuery: id値/タグ名/クラス名で特定の要素を取り出すには? ― 基本セレクター, 機械学習 開発者のためのSlackチーム、作りました:「機械学習&AI」「クラウド&ビッグデータ」「IoTデバイス」のネット記事情報を共有中。, 任意のRubyスクリプトを埋め込めるので、条件分岐や繰り返し構文などの処理も自由に記述できる. )", nil, Time.now) のような複数の条件を指定する時に、値にnilを指定したいのですが、うまくいかなくてつまづいています。また、このような場合に、条件句の中で、シンボルは使えますか? ご存知の方お助けくださいまし! 今回はコントローラーのnewアクションとeditアクションで定義した@articleを指定しています。, もちろんnew.html.erbだけでなくedit.html.erbも1行で書くことができます。, このように共通している全てのファイルで部分テンプレートを呼び出す記述に置き換えることができます。, renderメソッドには他にもオプションが用意されています。 例をみてみましょう。, 上の例だと部分テンプレート内で使用するname、adress、ageという3つの変数を定義しています。 今回作成した部分テンプレート_form.html.erbの中ではarticleという変数を使っているのでarticleと指定しています。, 右の@articleの部分はコントローラーやビューで定義した変数名を記述します。 もし別の名前として変数を使いたい場合は下記のように記述します。, この時、@hogesに入っている要素が一つずつ取り出され、部分テンプレート内の変数fugaに代入されます。, このように記述すると@hogesの要素が一つずつfugaという変数に代入され、部分テンプレート内で使用することができます。, 繰り返し部分テンプレートを使う場合、each文の中に記述するかcollectionオプションを使うか2つの方法があるということがわかりました。, どちらを使っても問題なく表示されるのですが、決定的な違いがあります。 このコードは下のコードと全く同じ結果になります。, この場合、viewsフォルダのhogesフォルダ内にある部分テンプレート_hoge.html.erbを自動で選択してくれます。 Rails 4.1 - 2014/04 Rails 4.0 - 2013/06 Rails 3.2 - 2012/01 Rails 3.1 - 2011/08 Rails 3.0 - 2010/08 Rails 2.3 - 2009/03 [未訳] Rails 2.2 - 2008/11 [未訳] 運営に関する情報 運営会社 利用規約 特定商取引法に基づく表記 プライバシーポリシー お問い合わせ 例えば下記のようなコードがあったとします。, このコードが何箇所でも使われているので下記のような部分テンプレートを作成したとします。, 上のコードは@hogesの要素の分だけ部分テンプレートが繰り返し呼び出されて表示されます。, この3行のコードをcollectionオプションを使うと下記のように1行で記述することができます。, collectionオプションを使用するとcollectionオプションに指定した変数の要素の分だけ部分テンプレートが繰り返し表示されます。, 先ほどの例だと@hogesにはhogesテーブルから繰り返して表示させたいレコードを取得して代入してあります。, そうすると自動で一つ一つの要素が取り出され部分テンプレートに渡されて繰り返し表示されるという流れになります。, またcollectionオプションを使用する時はpartial:を記述しないとエラーになるので気をつけましょう。, collectionオプションを使用した場合、部分テンプレート内で使用する変数はオプションで指定した変数が@hogesであったらその単数形のhogeになります。 実際に部分テンプレート内で使用してみます。, それでは実際部分テンプレートをどのように使うのか確認してみましょう。 そんな時に、複数のビューファイルの共通部分として作成するのが部分テンプレートです。, 部分テンプレートとしてビューファイルを作成する時は_sidemenu.html.erbのようにファイル名の前に_(アンダースコア)をつける必要があります。, それでは今作成した部分テンプレートを呼び出してみましょう。 そのため「部分テンプレートを呼び出しているよ」ということを明示的にする時はオプションを使って下記のように記述することもできます。, renderメソッドを記述したビューファイルと違うフォルダ内の部分テンプレートを呼び出すときは hoges/hogeのようにどのフォルダの部分テンプレートを使用しているかを記述する必要があります。, 下の例だと_right_content.html.erbはこのコードを記述しているindex.html.erbと同じフォルダにあるのでそのままファイル名を記述すれば呼び出すことができます。, _menu_html.erbはlayoutsフォルダ内にあるので、呼び出す際はlayouts/menuと記述する必要があります。, partialオプションは部分テンプレートを呼び出す時に使います。 それではなぜ部分テンプレートを使うのでしょうか? ですので部分テンプレートを繰り返し呼び出す時は出来るだけcollectionオプションを使う記述にしましょう。, 上のコードは下の3つの条件を全て満たしている時、このコードを省略して書くことができます。, このようにだいぶ短く書くことができます。 ),(start_at > ? 「パフォーマンスが悪くなる」というのは「実行速度が遅くなる」ということを意味します。, collectionオプションを使用して記述すると部分テンプレートが呼び出されるのは1回のみなので、eachで表示するよりもパフォーマンスが良くなります。, 上の例では1000回部分テンプレートを呼び出しました。 例えば部分テンプレート内で変数を使いたい場合、どこかで変数を定義する必要がありますね。 1,000回呼び出すことはまずないと思いますが、これだけの差になってしまいます。 partialを省略して書きたければ下記のように必ずlocalsオプションも省略しないといけないので注意しましょう。, localsオプションでは部分テンプレート内で使用する変数を複数定義することができます。 (煩雑になってしまいますが), こちらの質問の意図が読み取れなかったのですが、「こんなイメージ」みたいなものはありますか?, シンボルを使いたかったのは、(rails4で)whereの条件句内で、nilを指定する場合、, だとオブジェクトが返ってこなかったので、複数条件を指定する際にシンボルを使う方法はないかと探してました!, “回答を投稿”をクリックすることで利用規約、プライバシーポリシー、及びクッキーポリシーに同意したものとみなされます。, このRSSフィードを購読するには、このURLをコピーしてRSSリーダーに貼り付けてください。, サイトデザイン / ロゴ © 2020 Stack Exchange Inc; ユーザーの投稿はcc by-saでライセンスされます。 rev 2020.11.13.38000, スタック・オーバーフロー をより快適に使うためには JavaScript を有効化してください, Feature Preview: New Review Suspensions Mod UX, File.exist? Railsで変数の中身が空か確認する空チェックメソッド4種 Railsでは、View(ビュー)でもモデルでもコントローラでも『変数の中身が空か知りたい』ときはこれらのメソッドを使いわけて、チェックをします。 ご存知の方お助けくださいまし!, where で文字列を使うなら、そのまま書けると思います。 それはパフォーマンスの問題です。, ITの世界のパフォーマンスはコンピュータの処理や実行速度のことを言います。 「呼び出しているのは部分テンプレートだよ」と強調したいだけなので、つけなくても構いません。, localsオプションを使うと部分テンプレート内で使う変数の定義をすることができます。 の引数が nil だった時に nil または false を返す方法, rails testを実行するとundefined method `id' for nil:NilClassエラーが発生し、解決できない, Rspecのmodelテストで、user_id: nil, post_id: nilになってしまう。, 意見を述べること(意見を述べるなら、参照リソース、自分の経験で意見をサポートしてください). かなり簡潔に書くことができますね!, 部分テンプレートを使った時と使わない時ではビューの表示は全く変わりません。 コントローラーやビューファイルの中でビューファイルを呼び出すにはrenderメソッドを使用します。, renderメソッドは色々な形でビューを呼び出すことができます。 SELECT構文の中でも特に重要なWHERE句を紹介します。WHEREを使えるようになると、膨大なレコードの中から特定のレコードを抽出することが可能になります。 WHEREを使って検索する SELECT構文を使って特定のレコードを検索するには、WHERE句を使います。WHEREの後に条件式を指定することに … 部分テンプレートを使うメリットをいくつかあげてみます。, 例えばフォームに入力してもらう内容を変えたい場合、ファイルを編集する必要がありますね。, 部分テンプレートを使う前だとnew.html.erbとedit.html.erbの2つのファイルを編集する必要がありました。, ですが部分テンプレートとして切り分けると部分テンプレートだけ編集すれば良いので作業効率が上がったり、修正ミスが少なくなるなどというメリットがあります。, 部分テンプレートの名前をheaderやmenuなどの名前にしておくと、そのコードをみなくても「ああ、ここはヘッダーの部分なんだな」などコードの内容がとてもわかりやすくなります。, また一つのビューファイル自体が非常にコンパクトになります。

.

アナザースカイ 風間 動画, 鈴木愛理 グッズ Tシャツ, プロポーズ デザート メッセージ, 鬼 滅 の刃 ご当地 キーホルダー 岩手, 柄本明 自宅 場所, スイカ オートチャージ コンビニ, プロポーズ デザート メッセージ, 祝日 祭日 一覧, 七つの大罪 タルミエル 声優, 神楽 ラーメン 名古屋, 相鉄線 時刻表 横浜, プロポーズ デザート メッセージ, みなとみらい バースデープレート 可愛い, 鈴木愛理 グッズ Tシャツ, 相鉄線 時刻表 横浜, プロポーズ デザート メッセージ, コンビニ キャッシュレス還元 されない, 小学校 外国語 評価 テスト, 楽天 オペレーター チャット, ノートパソコン 天 板 保護, 教育実習 プレゼント メッセージカード, ミニベロ シートポスト 曲がる, 都営三田線 時刻表 大手町, 教育実習 プレゼント メッセージカード, 教育実習 プレゼント 幼稚園, 立体切断 アプリ 無料, 阪神 住吉 時刻表, ジミン ピアス 位置 2020, 立体切断 アプリ 無料, スイカ オートチャージ コンビニ, アナザースカイ 風間 動画, 鬼 滅 の刃 ご当地 キーホルダー 岩手, 楽天 オペレーター チャット, 立体切断 アプリ 無料, 鬼 滅 の刃 ご当地 キーホルダー 岩手, 阪神 住吉 時刻表, テレビドラマ アメリカ Sf,