記事データを表示する

記事データを表示する

吉田先生

viewファイルの中身が表示内容と連携されていることを確認しましょう。


記事データを表示する

ここまでの流れを1度確認してみましょう。

フォーム

から送信したデータは、createアクションとモデルが連動してデータベースへ保存されています。

保存されたデータを表示する為に、コントローラはshowアクションへうつります。

しかしブラウザの表示は、アクション名と同名のviewファイルの仕事です。

viewsフォルダを探してもshowアクションに対応したファイルがなかったので、エラーが表示されているというわけです。

1. redirect_to

createアクションには

def create

 @article = Article.new(article_params)

 

 @article.save

 redirect_to @article

end

 

 def article_params

   params.require(:article).permit(:title, :text)

 end

とredirectの表記がありますね。

これは@article.saveが完了した後にどこの画面に遷移するか、という指示部分です。

rake routesを思い出してください。

右のController#Actionの欄を見ると、表示にあたるのはarticles#showだとわかります。

中央のURIパターンはURLに追加してページを遷移するときに使用しました。

今回は左側のPrefix Verbに注目してください。

articles#showのPrefix列にはarticle GETと書かれています。

これはviewファイルで使用するlink_to(リンクを張る)メソッドや、コントローラで使用するrender,redirectメソッドなどでarticles#showを指定先にする際のパスを簡単に書くことができるものです。

通常はPrefix(article GETのarticleの部分)+_pathと表記します。

articlesの後ろについているGETは今は無視して大丈夫です。

つまり、

 @article.save

 redirect_to article_path

end

というコードは、データを保存した後はarticles GETの指定するarticles#showというController#Actionへ飛ぶということになります。

このコードがあるので、createアクションの後、showアクションがありませんよ!というエラーが表示されていたということです。

2.showアクションとビューを作成する

articlesコントローラにshowアクションを追加して、ブラウザを更新すると「showアクションの結果をブラウザに表示する為のtemplate(viewファイル)がありませんよ!」とエラーが表示されます。

new.html.erbファイルを作成したときと同様にviewsフォルダ内にshow.html.erbファイルを作成しましょう。

ここで注意するべきなのはファイル名はアクション名と同名にするという点です。

今回はshowアクションに対応するviewファイルなので、show.html.erbとなります。

ファイルを作成し、show.html.erbと仮に入力し保存しておきましょう。

ではこの状態でブラウザを更新するとどうなるでしょうか。

show.html.erbに記載した内容がブラウザに表示されています。

showアクションとviewファイルが連動している為、show.html.erbに入力した内容がそのまま表示されています。

では、フォームに入力してパラメータへ送られたデータを表示させるにはどうしたら良いのでしょうか。

まずは、コントローラのshowアクションで該当の(表示したい)記事のデータを取得するようにコードを追加しましょう。

def show

   @article = Article.find(params[:id])

 end

createアクションでも解説したように、params[:パラメータ名]でパラメータの中から指定したデータを取得することができます。

今回は showアクションへ送られるパラメータのデータの中からidというパラメータ(データ)をfind(見つける)して、@articleという箱へ入れなさいという指示です。

これで@articleというインスタンス変数には、idに紐づいた記事のデータを入れることができました。

ではshow.html.erbでインスタンス変数を使用して記事を表示させてみましょう。

  <h1><%= @article.title %></h1>
   <p><%= @article.text %></p> 

とコードを追加してファイルを保存してください。

ブラウザを更新するとフォームから投稿した内容が表示されます。

 

 

無料ビデオ講座のお知らせ

Skillhub [スキルハブ]では無料の動画講座を多数公開しています。他校だと数万円するような講座が無料で受講できます。

無料講座一覧を見る

×