每个对象上传多张图片

Question

我正在尝试将图片添加到 Rails 教程中的帖子中，并将其扩展到我的需要。我有一个指南，它可以有很多与之相关的图片，而不仅仅是教程中的一张。

我希望有一个按钮来上传图片。用户应该能够重复使用此按钮来上传多张图片。

我正在尝试使用 Accepts_nested_attributes，就像在这个答案中一样，但我不确定如何使用它：Rails 4 multiple image or file upload using carrierwave

我的指南模型：

class Guide < ActiveRecord::Base
  belongs_to :user
  has_many :guide_pics, dependent: :destroy
  accepts_nested_attributes_for :guide_pics
end

我的 GuidePic 模型：

class GuidePic < ActiveRecord::Base
  belongs_to :guide
  validates :guide_id, presence: true

  default_scope -> { order(created_at: :desc) }

  mount_uploader :picture, PictureUploader
end

我的编辑视图呈现图片上传器，它允许我选择一张图片。我认为我不需要显示它的代码，但如果需要，我可以提供它。当我点击上传时，它会进入我的指南控制器。我的 GuidePics 控制器中没有任何内容。

我认为我的 Guide 控制器必须更新图片，我正在尝试通过调用 guide_params 来完成此操作

@guide.update_attributes guide_params

但我不明白我的 guide_params 函数需要是什么。我给了我一个错误“不允许的参数：图片”：

def guide_params
   params.require(:guide).permit(:name, :city, :province, :country, :description, 
                                guide_pics_attributes: [:id, :guide_id, :picture]) 
end

另外，这是我上传图片的表格：

<!-- Upload pictures -->
<div class="col-md-2 col-md-offset-1">
   <strong>Upload A Picture</strong>
</div>
<div class="col-md-8 guide-edit-form guide-pic-upload">
  <%= form_for(@guide, html: { multipart: true }) do |f| %>
    <div class="picture" style="float:left;">
      <%= f.file_field :picture %>
    </div>
    <div style="">
      <%= f.submit "Upload", class: "btn btn-primary edit-guide-btn" %>
  </div>
  <% end %>
</div>

---

问题出在我的表单上。这是基于马特的回答的解决方案：

<!-- Upload pictures -->
<div class="col-md-2 col-md-offset-1">
   <strong>Upload A Picture</strong>
</div>
<div class="col-md-8 guide-edit-form guide-pic-upload">
  <%= form_for(@guide, html: { multipart: true }) do |f| %>
    <%= f.fields_for :guide_pics, @guide.guide_pics.build do |p| %>
      <div class="picture" style="float:left;">
        <%= p.file_field :picture %>
      </div>
    <% end %>
    <div style="">
      <%= f.submit "Upload", class: "btn btn-primary edit-guide-btn" %>
  </div>
  <% end %>
</div>

Answer 1

再次阅读您链接的指南，您需要使用fields_for作为表单的子项组件：

<%= form_for(@post, :html => { :multipart => true }) do |f| %>
    <div class="field">
        <%= f.label :title %><br>
        <%= f.text_field :title %>
    </div>

    <%= f.fields_for :post_attachments do |p| %>
        <div class="field">
            <%= p.label :avatar %><br>
            <%= p.file_field :avatar, :multiple => true, name: "post_attachments[avatar][]" %>
        </div>
    <% end %>

    <div class="actions">
        <%= f.submit %>
    </div>
<% end %>

所以在你的情况下，更像是：

<%= form_for(@guide, html: { multipart: true }) do |f| %>
    <%= f.fields_for :post_attachments do |p| %> 
        <div class="picture" style="float:left;">
            <%= p.file_field :picture %>
        </div>
    <% end %>
    <div style="">
        <%= f.submit "Upload", class: "btn btn-primary edit-guide-btn" %>
    </div>
<% end %>