Rails4：如何使用载波显示和编辑上传的文件？

Question

我可以上传文件并将文件名保存在数据库中。 但是文件名在我编辑时没有出现。

我想：

1. 单击_article.html.erb中的“编辑”链接时，将显示文件名和上传的图像。
2. 在_article.html.erb中显示上传的图像。

article.rb

class Article < ActiveRecord::Base
    .
    .
    has_many :photos, dependent: :destroy
    accepts_nested_attributes_for :photos
    .
    .
end

photo.rb

class Photo < ActiveRecord::Base
    belongs_to :article
    mount_uploader :image, ImageUploader
    validates :image, presence: true
    #validates :article_id, presence: true
end

.schema文章

CREATE TABLE "articles" ("id" INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL, 
"content" varchar(255), 
"user_id" integer, 
"created_at" datetime, 
"updated_at" datetime,);

.schema照片

CREATE TABLE "photos" ("id" INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL, 
"article_id" integer, 
"image" varchar(255), 
"created_at" datetime, 
"updated_at" datetime);

articles_controller.rb

class ArticlesController < ApplicationController
    .
    .
  def new
    @article = Article.new
    @article.photos.build
    .
    .
  end

  def create
    @article = current_user.articles.build(article_params)
    .
    .
  end

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

  def update
    @article = Article.find(params[:id])
    if @article.update(article_params)
      redirect_to current_user
    else
      render 'edit'
    end
  end
    .
    .
  private

    def article_params
      params.require(:article).permit(:content, photos_attributes: [:id, :article_id, :image])
    end
    .
    .
end

article \\ _article.html.erb

我想在此处并单击“编辑”链接（_article_form.html.erb）后显示上传的图像和文件名。

<li>
    .
    .
  <span class="content"><%= article.content %></span>
  <% if current_user?(article.user) %>
    <%= link_to "Edit", edit_article_path(article.id), class: "btn btn-default" %>
  <% end %>
</li>

文章\\ edit.html.erb

<h1>Update article</h1>
<div class="row">
        <%= render 'shared/article_form' %>
</div>

共享\\ _article_form.html.erb

当我编辑时，将显示“：content”。 但是“：image”是“未选择文件” ...

<%= form_for(@article) do |f| %>
  <div class="field">
    <%= f.text_area :content, placeholder: "Compose new article..." %>
    <%= f.fields_for :photos do |p| %>
      <%= p.hidden_field :article_id %>
      <%= p.label :image %>
      <%= p.file_field :image %>
    <% end %>
  </div>
  <%= f.submit "Post", class: "btn btn-large btn-primary" %>
<% end %>

development.log（当我提交新文章时）

Started POST "/articles" for 127.0.0.1 at 2014-07-05 16:31:11 +0900
Processing by ArticlesController#create as HTML
  Parameters: {"utf8"=>"?","authenticity_token"=>"uaWcqBZ6rhS/NIal/...=", "article"=>{"category_id"=>"6", "content"=>"last", "photos_attributes"=>{"0"=>{"article_id"=>"", "image"=>#<ActionDispatch::Http::UploadedFile:0x3cb0910 @tempfile=#<File:C:/.../AppData/Local/Temp/RackMultipart20140705-6112-1q9t7r6>, @original_filename="DSCN0721_080.JPG", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"article[photos_attributes][0][image]\"; filename=\"DSCN0721_080.JPG\"\r\nContent-Type: image/jpeg\r\n">}}}, "commit"=>"Post"}
  [1m[35mUser Load (1.0ms)[0m  SELECT "users".* FROM "users" WHERE "users"."remember_token" = '...' LIMIT 1
  [1m[36m (0.0ms)[0m  [1mbegin transaction[0m
  [1m[35mSQL (3.0ms)[0m  INSERT INTO "articles" ("content", "created_at", "category_id", "updated_at", "user_id") VALUES (?, ?, ?, ?, ?)  [["content", "last"], ["created_at", Sat, 05 Jul 2014 07:31:11 UTC +00:00], ["category_id", 6], ["updated_at", Sat, 05 Jul 2014 07:31:11 UTC +00:00], ["user_id", 1]]
  [1m[36mSQL (27.0ms)[0m  [1mINSERT INTO "photos" ("article_id", "created_at", "image", "updated_at") VALUES (?, ?, ?, ?)[0m  [["article_id", 306], ["created_at", Sat, 05 Jul 2014 07:31:11 UTC +00:00], ["image", "DSCN0721_080.JPG"], ["updated_at", Sat, 05 Jul 2014 07:31:11 UTC +00:00]]
  [1m[35m (5.0ms)[0m  commit transaction
Redirected to http://localhost:3000/users/1
Completed 302 Found in 128ms (ActiveRecord: 36.0ms)

Answer 1

我之前曾提出过相同的问题，但没有找到任何解决方案。 我在这里做什么

<%= form_for(@article) do |f| %>
  <div class="field">
    <%= f.text_area :content, placeholder: "Compose new article..." %>
    <%= f.fields_for :photos, @article.photos do |p| %>
      <%= p.hidden_field :article_id %>
      <%= p.label :image %>
      <% if p.object.image %>
        <%= image_tag p.object.image.url %>
        <p><%= p.object.image.file.filename %></p>
      <% end %>
      <%= p.file_field :image %>
    <% end %>
  </div>
  <%= f.submit "Post", class: "btn btn-large btn-primary" %>
<% end %>

即使您尝试通过js将图像文件名设置为file_field，也会出现以下错误

无法在“ HTMLInputElement”上设置“ value”属性：此输入元素接受文件名，该文件名只能以编程方式设置为空字符串。