【rails】f.file_fieldによる画像複数枚投稿の実装方法

こんばんわ。
今日はrailsでの複数枚画像投稿の実装方法の記事を書いていきたいと思います。

前提

画像の一枚ずつでの投稿は実装できているものとします。その際のコードを下に示します。
(今回は複数枚投稿の実装方法のため、変更を加えるviewとcontrollerしかコードを紹介していません。)

new.html.haml

.image__upload
  .image__upload__title
    写真
  .image__upload__field
    = icon('fas', 'camera')
  = f.file_field :photograph, class: "image__form"
.new__image__post
  = button_tag type: "submit", class: "new__image__post__button" do
    %i.fas.fa-arrow-circle-up
    UPLOAD

images_controller

class ImagesController < ApplicationController

  def new
    @events = Event.all
    @image = Image.new
  end

  def create
    @image = Image.new(image_params)
    @image.save
  end
  
  private
  def image_params
    params.require(:image).permit(:user_id, :event_id, :photograph).merge(user_id: current_user.id)
  end

end

実装の流れ

①　Viewでfile_fieldメソッドに:multiple => trueのオプションをつけて複数枚投稿を可能にする。
②　Controllerで配列の形で送られてくる画像を一枚ずつ取り出して保存処理を行う。

①　Viewでfile_fieldメソッドに:multiple => trueのオプションをつけて複数枚投稿を可能にする。

= f.file_field :photograph, :multiple => true, class: "image__form"

変更前

変更後

変更前と変更後を比べると、name属性がimage[photograph]からimage[photograph][]となり、画像が配列の形で複数枚paramsに入れてコントローラー側に送れることが分かります。

②　Controllerで配列の形で送られてくる画像を一枚ずつ取り出して保存処理を行う。

:multiple => trueとすることで、画像が配列の形で送られてくるので、それをeachメソッドを使って一枚ずつデータベースへ保存する記述をします。

def create
  params[:image][:photograph].each do |photograph|
    new_image = Image.new(event_id: params[:image][:event_id], photograph: photograph, user_id: current_user.id)
    new_image.save
  end
  redirect_to images_path
end

以上になります。:multiple => trueにすることでどのようにして複数枚投稿を可能にしているかが理解すれば簡単に実装できるかと思います。
ここまで読んでくださり、ありがとうございました。分かりにくいやアドバイス等ありましたらコメントくださると幸いです。では！