如何使用嵌套表单轨道预览多个图像

Question

我正在使用回形针上传图片和嵌套表格。

我想将图像预览为输入，而不仅仅是图像。

这是我的表格。

= nested_form_for @anime, html:{multipart:true} do |f|
  - if @anime.errors.any?
    #error_explanation
      %h2= "#{pluralize(@anime.errors.count, "error")} prohibited this anime from being saved:"
      %ul
        - @anime.errors.full_messages.each do |msg|
          %li= msg
  .field
    = f.label :name
    = f.text_area :name
  .fields
    =f.fields_for :images do |i|
      =i.file_field :content
      =i.link_to_remove "Remove"
  .field
    =f.link_to_add "add Image", :images
  .actions
    = f.submit 'Save'

这是我的模特。

class Image < ApplicationRecord
  belongs_to :imageable, :polymorphic => true, optional:true
  has_attached_file :content, :styles=>{:medium => "300x300>", :thumb => "100x100>"}
  validates_attachment_content_type :content, :content_type => %w(image/jpeg image/jpg image/png)
end

class Anime < ApplicationRecord
  has_many :images, :as => :imageable, dependent: :destroy
  accepts_nested_attributes_for :images, :allow_destroy => true
end

这是我的控制器

class AnimesController < ApplicationController
  before_action :set_anime, only: [:show, :edit, :update, :destroy]

  # GET /animes
  # GET /animes.json
  def index
    @animes = Anime.all
  end

  # GET /animes/1
  # GET /animes/1.json
  def show
  end

  # GET /animes/new
  def new
    @anime = Anime.new
    @anime.images.build
  end

  # GET /animes/1/edit
  def edit
  end

  # POST /animes
  # POST /animes.json
  def create
    @anime = Anime.new(anime_params)

    respond_to do |format|
      if @anime.save
        format.html { redirect_to @anime, notice: 'Anime was successfully created.' }
        format.json { render :show, status: :created, location: @anime }
      else
        format.html { render :new }
        format.json { render json: @anime.errors, status: :unprocessable_entity }
      end
    end
  end

  # PATCH/PUT /animes/1
  # PATCH/PUT /animes/1.json
  def update
    respond_to do |format|
      if @anime.update(anime_params)
        format.html { redirect_to @anime, notice: 'Anime was successfully updated.' }
        format.json { render :show, status: :ok, location: @anime }
      else
        format.html { render :edit }
        format.json { render json: @anime.errors, status: :unprocessable_entity }
      end
    end
  end

  # DELETE /animes/1
  # DELETE /animes/1.json
  def destroy
    @anime.destroy
    respond_to do |format|
      format.html { redirect_to animes_url, notice: 'Anime was successfully destroyed.' }
      format.json { head :no_content }
    end
  end

  private
    # Use callbacks to share common setup or constraints between actions.
    def set_anime
      @anime = Anime.find(params[:id])
    end

    # Never trust parameters from the scary internet, only allow the white list through.
    def anime_params
      params.require(:anime).permit(:name, images_attributes: [:content])
    end
end

请帮帮我

非常感谢。

忽略此消息